Pertemuan ke 9 XML XML Introduction How to
- Slides: 26
Pertemuan ke 9: XML
XML Introduction How to Use XML How to make xml XML and CSS XML and XSL
Introduction XML: Extensible Markup Language Defined by the WWW Consortium (W 3 C) Documents have tags giving extra information about sections of the document ◦ E. g. <title> XML </title> <slide> Introduction …</slide> Extensible, unlike HTML ◦ Users can add new tags, and separately specify how the tag should be handled for display
XML Introduction (Cont. ) The ability to specify new tags, and to create nested tag structures make XML a great way to exchange data, not just documents. ◦ Much of the use of XML has been in data exchange applications, not as a replacement for HTML Tags make data (relatively) self-documenting ◦ E. g. <bank> <account_number> A-101 </account_number> <branch_name> Downtown </branch_name> <balance> 500 </balance> </account> <depositor> <account_number> A-101 </account_number> <customer_name> Johnson </customer_name> </depositor> </bank>
What You Should Already Know HTML JAVASCRIPT
WHAT IS XML? XML stands for EXtensible Markup Language XML is a markup language much like HTML XML was designed to carry data, not to display data XML tags are not predefined. You must define your own tags XML is designed to be self-descriptive XML is a W 3 C Recommendation
THE DIFFERENCE BETWEEN XML AND HTML XML is not a replacement for HTML. XML and HTML were designed with different goals: XML was designed to transport and store data, with focus on what data is HTML was designed to display data, with focus on how data looks HTML is about displaying information, while XML is about carrying information.
XML Does Not DO Anything Maybe it is a little hard to understand, but XML does not DO anything. XML was created to structure, store, and transport information. The following example is a note to Tove, from Jani, stored as XML: <note> <to>Tove</to> <from>Jani</from> <heading>Reminder</heading> <body>Don't forget me this weekend!</body> </note> The note above is quite self descriptive. It has sender and receiver information, it also has a heading and a message body. But still, this XML document does not DO anything. It is just information wrapped in tags. Someone must write a piece of software to send, receive or display it.
With XML You Invent Your Own Tags The tags in the example before (like <to> and <from>) are not defined in any XML standard. These tags are "invented" by the author of the XML document. The XML language has no predefined tags. The tags used in HTML are predefined. HTML documents can only use tags defined in the HTML standard (like <p>, <h 1>, etc. ). XML allows the author to define his/her own tags and his/her own document structure
XML is Not a Replacement for HTML XML is a complement to HTML. It is important to understand that XML is not a replacement for HTML. In most web applications, XML is used to transport data, while HTML is used to format and display the data. My best description of XML is this: XML is a software- and hardwareindependent tool for carrying information.
Example of Nested Elements <bank-1> <customer_name> Hayes </customer_name> <customer_street> Main </customer_street> <customer_city> Harrison </customer_city> <account_number> A-102 </account_number> <branch_name> Perryridge </branch_name> <balance> 400 </balance> </account> <account> … </account> </customer> </bank-1>
Example XML <? xml version="1. 0" encoding="ISO-8859 -1"? > <note> <to>Tove</to> <from>Jani</from> <heading>Reminder</heading> <body>Don't forget me this weekend!</body> </note>
XML Documents Form a Tree Structure XML documents must contain a root element. This element is "the parent" of all other elements. The elements in an XML document form a document tree. The tree starts at the root and branches to the lowest level of the tree. <root> <child> <subchild>. . . </subchild> </root>
Xml Example
<bookstore> <book> <title >Everyday Italian</title> <author>Giada De Laurentiis</author> <year>2005</year> <price>30. 00</price> </book> <title>Harry Potter</title> <author>J K. Rowling</author> <year>2005</year> <price>29. 99</price> </book> <title>Learning XML</title> <author>Erik T. Ray</author> <year>2003</year> <price>39. 95</price> </bookstore>
XML RULES
All XML MUST HAVE A CLOSING TAG In HTML, some elements do not have to have a closing tag: <p>This is a paragraph. In XML, it is illegal to omit the closing tag. All elements must have a closing tag: <p>This is a paragraph. </p>
XML Tags are Case Sensitive XML tags are case sensitive. The tag <Letter> is different from the tag <letter>. Opening and closing tags must be written with the same case: <Message>This is incorrect</message> <message>This is correct</message>
XML Elements Must be Properly Nested <b><i>This text is bold and italic</b></i> In XML, all elements must be properly nested within each other: <b><i>This text is bold and italic</i></b>
XML Output in Web Browser Script XML: <? xml version="1. 0"? > <academic> <student> <id>12345</id> <name>Almira Wijaya</name> </student> <id>12346</id> <name>Danuar Aldi</name> </student> </academic> S 1 Teknik Informatika - Unijoyo 20
Latihan Buatlah sebuah file xml berdasarkan tree berikut ini katalog cd title artist country price
Latihan (cont) Title Isilah Bleach Artist Country Price Steal this album System of a down USA $25 Toxicity System of a Down USA $25 One Day Remains Alter Bridge USA $25 Blacbird Alter Bridge USA $25 Weathered Creed USA $20 data pada katalog tersebut dengan data Nirvana USA $20 sebagai berikut Nevermind Nirvana USA $20
XML with CSS Script contoh. xml <? xml version="1. 0"? > <? xml-stylesheet type="text/css" href="estyle. css"? > <academic> <student> <id>12345</id> <name>Almira Wijaya</name> </student> <id>12346</id> <name>Danuar Aldi</name> </student> </academic> Script estyle. css: academic { background-color: #ffffff; width: 100%; } student { display: block; background-color: #DDDDDD; margin-bottom: 5 pt; } id { background-color: #999999; margin-bottom: 12 pt; } name { color: #0000 FF; font-size: 12 pt; }
Latihan 1. Buatlah file css dari file xml dari latihan sebelumnya
XLS XSL = Style Sheets for XML does not use predefined tags (we can use any tag-names we like), and therefore the meaning of each tag is not well understood. A <table> tag could mean an HTML table, a piece of furniture, or something else - and a browser does not know how to display it. XSL describes how the XML document should be displayed!
Latihan 1. 2. Buatlah sebuah file xml yang dihubungkan dengan css Buatlah sebuah file xml yang dihubungkan dengan xsl