Gondolom az olvasók többsége már találkozott XML dokumentumokkal, melyeknek legnagyobb része a webes környezetben fordult elő. Ez így is van rendjén, mivel az XML fő célja az internetes információcsere támogatása. A cikksorozatban is az XML, interneten való kihasználását szeretném bemutatni. Mint tudjuk, a weboldalak legelterjedtebb és legegyszerűbb megjelenítési módja a böngésző, ezért feltétlenül szeretném pár sorban leírni, hogyan is jelenik meg egy XML dokumentum a böngészőben.

Vegyük példának a Microsoft Internet Explorert, amely egy külön szoftvermodult használ az XML dokumentumok értelmezésére és megjelenítésére. A Microsoft XML Core Services, vagy rövidebben az MSXML, a böngésző telepítőcsomagjának részét képezi, így a telepítés után, képes a böngészőnk az XML dokumentumok értelmezésére és megjelenítésére. Például az IE 6.0-ás verzió telepítésekor az MSXML 3.0-ás verziója kerül telepítésre. A cikksorozat egyes példaprogramjai, viszont megkövetelik az MSXML 4.0-ás verzióját, ezért ajánlott ezen verzió telepítése.

XML keletkezése és rövid története

Az Extensible Markup Language, vagy közismertebb nevén az XML a Word Wide Web Consortium (W3C) terméke. Az XML, mint ahogy a HTML is, az SGMLből leszármaztatott jelölőnyelv. Annak ellenére, hogy mindkét jelölőnyelv ősatyja ugyanazon nyelv, mégis alapjaikban különböznek. Míg a HTML megadott elemhalmazból épül fel, addig az XMLben saját magunk hozzuk létre az egyes elemeket.

Az SGMLből (Structured Generalized Markup Language vagy magyarul Általános Jelölőnyelv) lehet saját elemkészlettel rendelkező dokumentum típus leírást létrehozni, s ezen saját dokumentum típusok létrehozásának legismertebb terméke az 1991-ben létrehozott HTML volt.

Mivel az SGMLben elég tág korlátok közé vannak szorítva az egyes elemek létrehozásának feltételei, nehézkes lenne olyan programot írni, amely tökéletesen fel tudná dolgozni ezen dokumentumokat. A HTML nyelvben viszont kezdett nehézkessé válni a bonyolultabb felépítésű adatok tárolása illetve megjelenítése. Ezért volt szükség egy, a webre optimalizált jelölőnyelv létrehozására, amelyet a W3C fejlesztőcsapata alkotott meg 1996-ban, Kiterjesztett Jelölőnyelv néven (Extensible Markup Language). Mivel az XML-ben az elemek létrehozására szűkebb szabályok vonatkoznak mint az SGML-re, ezért könnyebben megtanulható, olvasható és leprogramozható.

XML fejlesztőcsapat célkitűzései

Minden nagyobb terv megvalósítását az elérni kívánt célok megfogalmazása előzi meg. Nem volt ez másként az XML létrehozásánál sem. A fejlesztőcsapat 10 pontban foglalta össze az XML létrehozásának célját:

  • könnyű használhatóság a gyors elterjedés érdekében
  • széleskörű felhasználhatóság
  • kompatibilisnek kell lennie az SGML-el, s így az SGMLt értelmező szoftverek könnyen átalakíthatók XML értelmezésre is
  • egyszerű programírás az XML dokumentumok feldolgozására, így a nagyon gyorsan elterjed a programozók körében
  • az XML opcionális lehetőségeinek minimálisra csökkentése, amivel elkerülhetők az egyes feldolgozó programok kompatibilitási hibái
  • az XML forrásnak világosnak és olvashatónak kell lenni
  • XML szabványt rövid idő alatt kell kifejleszteni, így elérhető, hogy egyetlen nyelv terjedjen el, ellenben a sok kis szoftverfejlesztő cég félresikerült szabványaival
  • az XML szabványnak formálisnak és tömörnek kell lenni, az egyes félreértések elkerülése érdekében
  • egyszerű elkészíthetőség
  • a tömörség elhanyagolható, a hangsúly az olvashatóságon legyen

A cikksorozat végén, érdemes lesz visszatekinteni a fejlesztőcsapat célkitűzéseire, hogy mi magunk is megítéshessük, vajon sikerült-e elérni a kitűzött célok mindegyikét.

XML vagy HTML, esetleg mindkettő?

Az XML keletkezézése és rövid története című részben megtudtuk, hogy az XML és HTML ugyanazon ős leszármazottja, továbbá megtudtuk, hogy az XML saját elemek létrehozását engedélyezi, míg a HTML egy adott elemhalmazból dolgozik. Ezek után, azt hiszem jogos a kérdés: vajon az XML a HTML helyettesítésére hivatott, vagy tudja egyáltalán helyettesíteni?

Mivel az XMLben saját elemeket tudunk definiálni, ezért létrehozható a HTML elemcsalád másolata, valamint az egyes elemekhez stíluslap rendelésével, megoldható a HTMLben használt megjelenítés és formázás is. Ekkor viszont semmi mást nem csinálnánk, mint az XMLt lebutítanánk a HTML szintjére, aminek semmi értelme. Az XMLt a HTML kisegítésére hozták létre, s így együttesen, óriási mértékben kibővítve a weblapok lehetőségeit.

Ezek után lássunk pár példát az XML felhasználási területeire:

  • adatok tárolása (adatbázis funkció) - mivel egyszerű szöveges állomány világos szerkezettel, ezért könnyedén feldolgozható, vagy olvasható (akár szabad szemmel is)
  • az XML dokumentumok faszerkezetű struktúrája bármely (logikusan) csoportosított adat tárolását lehetővé teszi, ami stíluslap használatával könnyen megjeleníthetővé válik, ezért alkalmas bármilyen adat tárolására (pl. színházi darabok, versek)
  • egyedi dokumentum-típus definíció létrehozásával, saját jelölőnyelv alakítható ki:
    • WML - wap oldalakat leíró jelölőnyelv
  • VML - vektorgrafika leírására létrehozott jelölőnyelv
  • OFX - pénzügyi információk leírásárára létrehozott jelölőnyelv
  • NML - internetes hírcsere
Az első XML dokumentum létrehozása

Mint azt már említettem az XML dokumetumok egyszerű szöveges állományok, tehát a létrehozásukhoz, illetve szerkeszésükhoz nincs szügség semmilyen külön, erre a célre kifejlesztett programra. Nyugodtan használhatjuk a Windowsból jól ismert WordPadot, vagy NotePadot is. Esetlegesen használhatunk olyan szövegszerkesztő programokat, amelyek rendelkeznek pár extra funkcióval (pl. automatikus tördelés), s így megkönnyítve számunkra a szerkesztést.

Az XML dokumentumok szerkesztésénél egyetlen dologra kell odafigyelnünk, mégpedig a fájl kiterjesztésére, aminek "*.xml"-nek kell lenni.

Akkor lássunk is rögtön egy XML dokumentumot:

f1_vilagbajnokok_resz1.xml

<?xml version="1.0" encoding="ISO-8859-2"?> <?-- f1_vilagbajnokok_resz1.xml --> <F1VILAGBAJNOKOK>    az eddigi forma1es vilagbajnokok közül néhány    <F1VILAGBAJNOK>       <EV>2002</EV>       <NEV>Michael Schumacher</NEV>       <NEMZETISEG>Nemet</NEMZETISEG>     </F1VILAGBAJNOK>    <F1VILAGBAJNOK>       <EV>1984</EV>      <NEV>Niki Lauda</NEV>      <NEMZETISEG>Oszrak</NEMZETISEG>    </F1VILAGBAJNOK>    <F1VILAGBAJNOK>       <EV>1956</EV>       <NEV>Juan Fangio</NEV>       <NEMZETISEG>Argentin</NEMZETISEG>    </F1VILAGBAJNOK> </F1VILAGBAJNOKOK>
Magyarázat: A dokumentum tartalmazza a forma1es világbajnokok egy részének nevét, nemzetiségét illetve a világbajnoki cím megszerzésének évét. A dokumentum első sorában szerepel a dokumentum fejléc, utánna következik egy kommentár, majd ezt követi maga az adatrész. Az adatrészt egyetlen elem fogja közre, ez az úgynevezett dokumentumelem, ami a mi példánkban a <F1VILAGBAJNOKOK>. Minden elemnek rendelkezni kell egy nyitó (<elemnév>) és egy záró  (</elemnév>) elemmel. Az egyes elemeknek lehet elem, illetve szöveg tartalma. Mi esetünkben a dokumentumelem tartalmazza mindkettőt. Bővebben az egyes elemek létrehozásának szabályairól a következő fejezetben fogunk foglalkozni.

Nos, e rövid magyarázat után, lássuk, hogyan is jeleníthető meg a dokumentumunk. Mint azt már elmítetettem, a böngésző képes az XML dokumentum megjelenítésére, ilyenkor maga a böngésző végzi a feldolgozást és a megjelenítést is. Ha az XML dokumentumot a HTML oldalba beágyazva jelenítenénk meg, akkor a megjelenítést már a HTML oldal végezné, valamilyen szkript vagy DSO objektum segítségével (mindkét elmített megoldás, bemutatásra kerül a későbbiekben).

Most térjünk vissza a böngészőben való megjelenítéshez. Kettőt kattintva a forrásfájlra, a böngésző megnyitja a dokumentumot és formázza is azt, egy, a böngészőben definiált stílus szerint. Ha az egyes elemek elemtartalommal rendelkeznek (újabb elemeket tartalmaznak), akkor a nyitó elem előtt egy '-' jel jelenik meg, ami lehetővé teszi az egyes elem (vagyis a tartalma) becsukását és újbóli megnyitását. Ezzel is növelve a dokumentum áttekinthetőségét.

Pár bemutató példa, a következő fejezetekből

Ahogy azt már fentebb említettem, az egyes XML dokumentumokhoz stíluslap rendelhető, s így rákényszerítve a böngészőt, hogy az általunk megadott stíluslap alapján jelenítse meg a dokumentumot. Lássunk erre egy példát:

f1_vilagbajnokok_resz2.xml

<?xml version="1.0" encoding="ISO-8859-2"?> <?xml-stylesheet type="text/css" href="f1vilagbajnokok.css"?> <?-- f1_vilagbajnokok_resz2.xml --> <F1VILAGBAJNOKOK>    az eddigi forma1es vilagbajnokok közül néhány    <F1VILAGBAJNOK>       <EV>2002</EV>       <NEV>Michael Schumacher</NEV>       <NEMZETISEG>Nemet</NEMZETISEG>     </F1VILAGBAJNOK>    <F1VILAGBAJNOK>       <EV>1984</EV>      <NEV>Niki Lauda</NEV>      <NEMZETISEG>Oszrak</NEMZETISEG>    </F1VILAGBAJNOK>    <F1VILAGBAJNOK>       <EV>1956</EV>       <NEV>Juan Fangio</NEV>       <NEMZETISEG>Argentin</NEMZETISEG>    </F1VILAGBAJNOK> </F1VILAGBAJNOKOK>

A példadokumentum tartalma egyetlen sorral bővült a fentihez képest, mégpedig a stíiluslap definíciójának sorával, mely tartalmazza a stíluslap típusát (type) és erőforrását (href).

f1vilagbajnokok.css

F1VILAGBAJNOK{ display:block; margin-top:12pt; font-size:10pt } EV{ font-size:12pt; font-weight:bold; } NEV{ margin-left:15pt; font-weight:bold } NEMZETISEG{ margin-left:15pt; font-style:italic }

Amint azt látjuk, a stíluslap felépítése megegyezik a HTML-ben megszokottal. Egyetlen kivétel ez alól, hogy az egyes stílusokat az általunk definiált elemekhez rendeljük hozzá. Ez annyit jelent, hogy az XML dokumentumban használt elemneveket adjuk meg a stíluslapban.

A következő példa az úgynevezett adatkötéses tartalommegjelenítést kívánja bemutatni. A adatok az adatforrás objektumon (Data Source Object) keresztül vannak hozzárendelve HTML elemekhez. Itt érdemes megjegyezni, hogy magát a megjelenítést már a HTML és a DSO végzi, nem pedig a böngésző.

f1_vilagbajnokok_XML.htm

<HTML> <HEAD>   <TITLE>Adatkotes</TITLE>   <XML ID="XML" SRC="f1_vilagbajnokok.xml"></XML> </HEAD> <BODY>   <input type="button" value="< elozo oldal" onClick="table.previousPage()">   <input type="button" value="kovetkezo oldal >" onClick="table.nextPage()">   <TABLE DATASRC="#XML" DATAPAGESIZE="10" id="table">     <THEAD>       <TR>         <TD width="70"><B>Evszam</B></TD>         <TD width="150"><B>Versenyzo neve</B></TD>        <TD><B>Nemzetiseg</B></TD>      </TR>    </THEAD>    <TR>      <TD bgcolor="silver"><SPAN DATAFLD="ev"></SPAN></TD>      <TD bgcolor="gray"><SPAN DATAFLD="nev"></SPAN></TD>      <TD bgcolor="silver"><SPAN DATAFLD="nemzetiseg"></SPAN></TD>    </TR> </TABLE> </BODY> </HTML>

Ezen példából kiderül, mennyire egyszerűen oldható meg az XMLben tárolt adatok megjelenítésénél a lapozás. A DSO objektum szolgáltatta adatok egyszerűen az XML dokumentumban használt elemnevek alapján hozzá vannak rendelve a táblázat egyes mezőihez. Ezután a DSO objektum feltölti a táblázatot a XML dokumentumból kiolvasott adatokkal.

Utolsó példaként az XMLHTTP működését szeretném bemutatni, melyben az XMLHTTP objektum segítségével kérést intézünk a szerver felé, majd kiiratjuk a szervertől kapott XML formátumú választ. Mindezt kliens oldali JavaScript segítségével.

szerver_keres.htm

<HTML> <HEAD></HEAD> <BODY> <SCRIPT TYPE="text/javascript" LANGUAGE="JavaScript"> <!-- function GetServerinfo()                                                //ellenorzni, hogy csatlakozva van-e a szerver, lekeri az informaciot es kiirja {var xmlHttp, doc, children; if( !is_server_onLine("http://www.prog.hu") )                           //ha nincs csatlakozva a szerver hibauzenettel kilep     return alert("A szerver nincs kapcsolodva!"); xmlHttp = new ActiveXObject("Microsoft.XmlHttp");                       //xmlhttp objektum letrehozasa doc = new ActiveXObject("Microsoft.XmlDom");                            //uj, ures xml documentum letrehozasa xmlHttp.Open("PUT", "httprequest.php", false);                          //kapcsolat megnyitasa xmlHttp.Send();                                                         //nem kuldunk semmit csak fogadunk doc.loadXML(xmlHttp.responseText);                                      //az ures dokumentumba betoltsuk a visszakapott adatokat children = doc.documentElement.childNodes;                              //XML dokumentum-elem gyermekei alert(children.item(0).text + "\n" + children.item(1).text);            //dokumentum-elem 1 es 2 gyermekenek  }                                                                       //szoveges tartalmanak kiiratasa function is_server_onLine(server)                                       //lekerdezi hogy a szerver kapcsolodva e van { var sOnlineStatus = "-201"; try{       var objXMLHTTP = new ActiveXObject("Microsoft.XmlHttp");       objXMLHTTP.Open("GET", server, false);       objXMLHTTP.Send();       var sOnlineStatus = objXMLHTTP.status                                   //onlinesattus adja meg a server pillanatnyi allapotat     }catch (Err){ sOnlineStatus = "-202"; } if(sOnlineStatus !== "-202") return true;                               //202 == offline   else return false; } // --> </SCRIPT> <INPUT onclick="GetServerinfo()" type="button" value="szerver keres"> </BODY></HTML>

szerver_valasz.php

<?php echo "<?xml version=\"1.0\" encoding=\"ISO-8859-2\"?>"; echo "<data>Ezt a szervertol kaptuk!<elem1>elem1 tartalma</elem1></data>"; ?>

A szerver_keres.htm -ben, ha a "szerver keres" gombra kattintunk, a kliens oldali szkript az XMLHTTP objektum segítségével ellenőrzi, hogy a keresett szerver kapcsolódva -e van. Ha igen, akkor egy kérést intézünk a szerver_valasz.php-nek, ami válaszként egy XML dokumentumot küld vissza. Ezt az XML dokumentumot jelenítünk meg, egy JavaScriptes üzenőablakban.

A bemutatott példák magyarázatai nagyon rövidek, mivel az itt bemutatott példák és még rengeteg új példa is, ki lesz tárgyalva a cikksorozat következő részeiben. A példák bemutatásának célja nem az XML olvasóval való megértetése volt, csupán reprezentatív jelleggel szerettem volna bemutatni, hogy is néz ki egy XML dokumentum, és nagyjából mivel is fogunk foglalkozni a cikksorozat következő részeiben.

Ez a cikk, amolyan felvezető része volt az XMLt bemutató cikksorozatnak. A következő részben, már kicsit mélyebben belemerülünk az XML dokumentumok létrehozására vonatkozó szabályokba és megtanuljuk, milyen egy jólformázott XML dokumentum.

A cikkhez tartozó forráskódok és fájlok innen tölthetők le.