XML pro začátečníky - 3. část

• Prohlížení XML dokumentů
• XML + CSS
• XML + XSL
• Datové ostrůvky XML
• XML ve skutečném životě

Ve třetí a poslední části seriálu XML pro začátečníky, který překládám z w3schools.com, se naučíme efektivně zobrazovat XML dokumenty na obrazovku a prohodíme pár slov o XML parseru.

Prohlížení XML dokumentů

Nezpracované XML soubory můžeme zobrazit v prohlížečích Mozilla, Firefox, Opera, IE a Netscape 6+.

Avšak chceme-li, aby byl XML dokument vzhledově podobný webovým stránkám, budeme muset přidat dodatečné informace o zobrazování (viz další části článku).

Firefox a IE

Kliknutím na ikonku otevřete XML soubor a XML dokument bez dalších zobrazovacích informací se zobrazí s barevným rozlišením kódu. Nalevo od elementů naleznete symboly plus (+) nebo mínus (−), které slouží k rozbalení či sbalení struktury elementů. Pokud vám tyto znaky překáží, stačí si nechat zobrazit zdrojový kód stránky stejně jako na normální webové stránce.

Netscape 6+

Z rozbalovacího menu, které vyvoláte pravým kliknutím, vyberte položku „Zobrazit zdrojový kód“ a získáte barevně odlišené elementy.

Opera 7 a 8

Standardním postupem si nechejte zobrazit zdrojový kód a XML dokument se zobrazí jako neformátovaný text.

Zobrazení chybného XML souboru

Jak již bylo v seriálu řečeno, webový prohlížeč vás v případě chyby zastaví a ohlásí ji.

Příklady XML dokumentu z w3schools.com

Zde je několik ukázek XML souborů, s kterými budeme nadále pracovat v dalších kapitolách.

note.xml – Jednoduchý XML soubor, který vám má přiblížit strukturu XML dokumentu.

note_error.xml – XML soubor demonstrující, co se stane, když nalezne prohlížeč chybu.

cd_catalog.xml – Tátova kolekce CD, uložená ve formátu XML (staré a nudné tituly, myslím :)).

plant_catalog.xml – Katalog květin z květinářství jako XML.

simple.xml – Vybrali byste si snídani z tohoto menu?

Proč se XML zobrazuje takto?

XML dokument nepřenáší informace, jak se mají data zobrazovat. Protože XML tagy jsou „vyvinuté“ autorem XML dokumentu, prohlížeče nevědí, jestli tag <table> popisuje HTML tabulku nebo tabuli jídel.

Bez informací, jak data zobrazovat, zobrazuje většina prohlížečů raději XML dokument tak, jak jsou.

Tento problém lze vyřešit použitím CSS, XSL, JavaScriptu nebo datovými ostrůvky.

XML + CSS

Pomocí CSS (Cascading Style Sheets) můžete přidat zobrazovací informace do XML dokumentu.

Použití CSS k zobrazení dokumentu si ukážeme na příkladu kolekce CD.

XML soubor: CD katalog
Soubor s CSS styly: CSS soubor
Konečný výsledek: XML katalog formátovaný CSS styly

V kousku XML souboru (viz dolů) zaměřte svoji pozornost na druhou řádku (<?xml-stylesheet type=“text/css“ href=“cd_catalog.css“?>), která přiřazuje požadovaný CSS soubor.

<?xml version="1.0" encoding="ISO-8859-1"?>
<?xml-stylesheet type="text/css" href="cd_catalog.css"?>
<CATALOG>
  <CD>
    <TITLE>Empire Burlesque</TITLE>
    <ARTIST>Bob Dylan</ARTIST>
    <COUNTRY>USA</COUNTRY>
    <COMPANY>Columbia</COMPANY>
    <PRICE>10.90</PRICE>
    <YEAR>1985</YEAR>
  </CD>
  <CD>
    <TITLE>Hide your heart</TITLE>
    <ARTIST>Bonnie Tyler</ARTIST>
    <COUNTRY>UK</COUNTRY>
    <COMPANY>CBS Records</COMPANY>
    <PRICE>9.90</PRICE>
    <YEAR>1988</YEAR>
  </CD>
.
.
</CATALOG>

Formátování XML + CSS není budoucnost stylizace XML dokumentu. Tou je stylizace použitím W3C XSL standardu.

XML + XSL

XSL (eXtensible Stylesheet Language) je upřednostňovaný jazyk pro stylizaci XML dokumentů a je také o mnoho důmyslnější než CSS. Jednou z cest k použití XSL je převést XML v HTML předtím, než je zobrazen prohlížečem, jak ukazují následující příklady.

Zobraz XML soubor, XSL soubor a výsledek.

V následujícím příkladu zaměřte svou pozornost na druhý řádek (<?xml-stylesheet type=“text/xsl“ href=“simple.xsl“?>).

<?xml version="1.0" encoding="ISO-8859-1"?>
<?xml-stylesheet type="text/xsl" href="simple.xsl"?>
<breakfast_menu>
  <food>
    <name>Belgian Waffles</name>
    <price>$5.95</price>
    <description>
       two of our famous Belgian Waffles
    </description>
    <calories>650</calories>
  </food>
</breakfast_menu>

Chcete-li se dozvědět víc o XSL, navštivte XSL tutoriál na w3schools.com.

Datové ostrůvky XML

S IE můžete použít neoficiální tag <xml> k vytvoření datového ostrůvku.

Vložení XML dat do HTML

Myslím, že jste si již osvojili soubor note.xml (skrz seriál jsem jej překládal, což nemá nyní význam).

<?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>

Do HTML souboru můžete vložit XML soubor pomocí tagu <xml> (viz příklad). Atribut id obsahuje unikátní identifikátor pro datový ostrůvek a atribut src odkazuje na XML dokument, který chceme vložit.

<html>
 <body>
  <xml id="note" src="note.xml"></xml>
 </body>
</html>

Avšak data vložená touto značkou nejsou viditelná pro uživatele. Proto je nutný další krok, tj. formátovat a zobrazit data v datovém ostrůvku vazbou s HTML.

Vážeme data k HTML elementu

V následujícím příkladu vložíme XML soubor cd_catalog.xml do HTML souboru.

<html>
 <body>
  <xml id="cdcat" src="cd_catalog.xml"></xml>
  <table border="1" datasrc="#cdcat">
   <tr>
    <td><span datafld="ARTIST"></span></td>
    <td><span datafld="TITLE"></span></td>
   </tr>
  </table>
 </body>
</html>

Atribut datasrc tagu <table> váže tento HTML element k datovému ostrůvku XML. K vazbě používá atribut id elementu <xml>.

Tagy <td> nemohou být vázány k datům, takže používám tagy <span>. <span> umožňuje atributu datafld přiřadit XML element, který požadujeme (např.: datafld="ARTIST" nebo datafld="TITLE"). Tak jak je XML dokument čten, příslušné řádky se vytváří pro každý element <CD>.

Používáte-li IE 5 nebo vyšší, vyzkoušejte si to sami. Vyzkoušejte také tento příklad, který demonstruje použití tagů <thead>, <tbody>, <tfoot>.

XML ve skutečném životě

Tato kapitolka vám ukáže příklad z praxe, jak může být XML použito k přenosu informací.

Příklad: XML zprávy

XMLNews je specifikace pro výměnu zpráv a dalších informací. Použití standardu zjednodušuje práci jak tvůrcům zpráv, tak zákazníkům. Vytváření, přijímání a archivace jakýchkoliv zpráv není závislá na hardwaru, softwaru ani programovacím jazyku. Zde je příklad XMLNews dokumentu:

<?xml version="1.0" encoding="ISO-8859-1"?>
<nitf>
 <head>
  <title>Colombia Earthquake</title>
 </head>
 <body>
  <headline>
   <hl1>143 Dead in Colombia Earthquake</hl1>
  </headline>
  <byline>
   <bytag>By Jared Kotler, Associated Press Writer</bytag>
  </byline>
  <dateline>
   <location>Bogota, Colombia</location>
   <date>Monday January 25 1999 7:28 ET</date>
  </dateline>
 </body>
</nitf>

Poznámka: Na stránce w3schools.com, odkud tento seriál překládám, je poslední kapitolou určenou pro začátečníky tvorba a použití XML parseru. Jelikož jsem jej nikdy nepoužil (a asi ani nepoužiji), tuto kapitolu jsem do seriálu nezařadil. V případě zájmu si ji můžete přečíst v angličtině.

Nyní jste vyzbrojeni všemi základními poznatky o XML a základy o pomocných technikách. Na tento seriál plánuji navázat, takže doufám, že se vám líbil a že se vám bude líbit i případné pokračování.