XML pro web aneb od teorie k praxi, 15.díl - JavaScript a XSLT

Přestože prohlížeče Microsoft Internet Explorer a Mozilla si s XSLT poradí i bez skriptování, XSLT transformace řízené Javascriptem spektrum použití "stylových proměn" řádově rozšiřují. Dnes se podrobně podíváme jak na to.

Microsoft Internet Explorer

XSLT transformace

MSXML parser vestavěný v MSIE umožňuje transformovat DOM XML dokument XSLT stylesheetem pomocí dvou metod. Tyto metody se odlišují pouze výstupním formátem - zatímco metoda transformNode() vrací textový řetězec (string), metoda transformNodeToObject() provádí převod na objekt typu DOM XML dokument. Společným jmenovatelem obou metod je to, že transformován může být kterýkoliv DOM Node, nejen celý DOM XML dokument. XSLT stylesheet, který bude sloužit k transformaci, musí být načten stejným způsobem, jako kterýkoliv jiný DOM XML dokument (kterým také obecně vzato je) a před prováděním transformace je tedy potřeba, aby byl "připraven" jako DOM objekt. Není nutné k transformaci použít celý DOM XML dokument příslušného stylesheetu, úplně postačí i kterýkoliv jeho DOM Node, který "splňuje" naše požadavky na XSLT šablonu a umožnuje transformaci.

Syntaxe pro použití metody transformNode() vypadá následovně:

var outXmlString = xmlDoc.transformNode(xsltDoc);

Transformace do objektu typu DOM XML dokument pomocí metody transformNodeToObject() vypadá mírně odlišně:

xmlDoc.transformNodeToObject(xsltDox, outXmlDoc);

Jak je vidět, v tomto případě je DOM objekt pro výsledný dokument předáván jako parametr metody. Tento objekt je nutné inicializovat stejně, jako jakýkoliv jiný DOM XML dokument:

var outXmlDoc = new ActiveXObject("Msxml2.DOMDocument");
outXmlDoc.async = false;

Nyní si ukážeme XSLT transformaci na jednoduchém příkladu. Nejprve vytvoříme pomocnou funkci pro načtení DOM XML dokumentu. Pomocí této funkce budeme později načítat jak XML dokument, tak XSLT stylesheet.

function uploadXML(URL) {
   var xmlDoc = new ActiveXObject("Msxml2.DOMDocument");
   xmlDoc.async = false;
   xmlDoc.load(URL);
   return xmlDoc;
}

Nyní si vyzkoušíme XSLT transformaci na textový řetězec. Vstupními daty budou XML dokument a XSLT stylesheet, který jsme již používali v 10. dílu tohoto seriálu (v souvislosti s krátkým představením XSLT). Obligátní vypsání zdrojového kódu do dialogového okna provede následující funkce transformToString. Příklad je funkční v MSIE 6, v nižších verzích MSIE musí být nainstalován MSXML parser minimálně verze 3.0.

function transformToString(xmlURL, xslURL) {
 var xmlDoc = uploadXML(xmlURL);
 var xslDoc = uploadXML(xslURL);
 var output = xmlDoc.transformNode(xslDoc);
 alert(output);
}

Samozřejmě, že v praxi budeme zřejmě využívat XSLT transformaci k jiným účelům, než k poněkud neužitečnému vypsání zdrojového kódu :-).

XPath dotazy

Kromě XSLT transformací umožňuje MXSML parser v IE provádět i jiné užitečné operace, nerozlučně spjaté s jazykem XSLT - a to XPath dotazy. K dispozici je opět dvojice metod. Metoda selectNodes(), která přijímá jako svůj parametr XPath dotaz, vrací kolekci všech nodů vybraných tímto XPath dotazem. Metoda selectSingleNode() se liší pouze v jediné věci - nevrací kolekci (tj. defacto pole), ale pouze jediný uzel. Pokud dotazu odpovídá více uzlů, je vrácen první z nich. obě dvě metody je možné aplikovat jak na DOM XML dokument, tak na DOM uzel.

Tomu, kdo ovládá jazyk XPath, je zřejmě hned jasné, jak účinnými nástroji jsou tyto dvě metody. Naopak začátečníkům pronikajícím do těchto oblastní zatím nemusí být zřejmé, proč je potřeba metoda, která vrací pouze první uzel. Nejlepší cestou k pochopení budou opět příklady.

Nejprve si vyzkoušíme nasimulovat funkčnost DOM metody getElementsByTagName(). Následující příklad najde všechny elementy password v dokumentu.

var nodeColl = xmlDoc.selectNodes("//password");

Možnosti jazyka Xpath jsou ale mnohem širší. Pokud bychom chtěli dosáhnout funkčnosti následujícího příkladu pomocí standardních DOM metod, rozhodně bychom si nevystačili s jednou řádkou kódu. Proměnná nodeColl bude obsahovat kolekci všech elementů li, které mají definován atribut class s hodnotou "nazev" a jsou dětmi elementu ul.

var nodeColl = xmlDoc.selectNodes("//ul/li[class=`nazev`]");

Druhá metoda selectSingleNode() je zase jako stvořená pro hledání uzlů, o kterých víme, že se v dokumentu vyskytují pouze jednou. Typickým příkladem je element s určitou hodnotou atributu id (obecně pro XML řečeno, atributu typu ID).

var el = xmlDoc.selectSingleNode("//*[id=`no-123`]");

Mozilla -XSLT transformace

XSLT transformace umí také Mozilla. Ukážeme si způsob, který byl implementován v poslední stabilní verzi 1.2.1 a bude dostupný i v dalších verzích Mozilly. Předchozí verze Mozilly obsahovaly mírně odlišné, nyní zavržené rozhraní s podobnou funkčností.

Pro XSLT transformaci je určen objekt XSLTProcessor, který vytvoříme (jak jinak...) voláním stejnojmenného konstruktoru.

var XSLTP = new XSLTProcessor();

Nyní je potřeba načíst XML dokument a XSLT stylesheet jako DOM XML objekty a XSLT stylesheet "importovat do procesoru". Načtení XSLT stylesheetu budeme provádět úplně stejně, jako u jakéhokoliv jiného XML dokumentu v Mozille. Pro načtení XML dokumentů si vytvoříme funkci.

function uploadXML(URL) {
    var xmlD = document.implementation.createDocument("", "", null);
 xmlD.onload = counter;
 xmlD.load(URL);
   return xmlD;
}

Funkce counter, kterou jsme zaregistrovali jako ovladač události load (načtení XML dokumentu), provede kontrolu počtu načtených dokumentů - v případě, že máme načteny oba, spustí naší funkci transform.

var count = 0;
function counter() {
 count++;
 if(count==2) transform();
}

Před transformací je nutné importovat XSLT stylesheet do procesoru. Objekt XSLTProcessor disponuje k tomuto účelu metodou importStylesheet(), jejímž jediným parametrem je objekt XSLT stylesheetu. Stejně jako u MSXML, nemusí se jednat jen o samotný DOM XML dokument, ale může to být i kterýkoliv z jeho uzlů. který je sám "schopen zajistit" XSLT transformaci.

function transform() {
 var XSLTP = new XSLTProcessor();
 XSLTP.importStylesheet(xslDoc);
 var newXmlDoc = XSLTP.transformToDocument(xmlDoc);
 var XS = new XMLSerializer();
 alert(XS.serializeToString(newXmlDoc));
}

Nyní již můžeme přistoupit k vysvětlení samotné XSLT transformace. Objekt XSLTProcessor má dvě k tomu určené metody. Metoda transformToDocument() přijímá jako jediný parametr DOM XML dokument, který má být transformován. Výstupem mohou být tři typy objektů, dle zvoleného výstupního formátu v XSLT stylesheetu. Pokud je výstupním formátem XML, je vrácen DOM XML dokument. Pokud je výstupním formátem HTML, je vrácen objekt typu DOM HTML dokument. A nakonec, pokud je výstupním formátem prostý text, je vrácen DOM XML dokument s jediným elementem (transformiix:result), který obsahuje výstupní text.

var newXmlDoc = XSLTP.transformToDocument(xmlDoc);

Kvůli vypsání HTML dokumentu ve formě stringu jsme museli zavolat objekt XMLSerializer a jeho metodu serializeToString(). Nyní se můžete se podívat na příklad, který dosahuje stejné funkčnosti jako v Internet Exploreru.

Druhá metoda, určená k transformaci, má název transformToFragment(). Tato metoda vrací objekt typu DOM DocumentFragment Má navíc druhý parametr, kterým je DOM dokument, ke kterému má fragment patřit.

var newFrag = XSLTP.transformToFragment(xmlDoc, document);

Fragment bude objektem typu DOM HTML, pokud dokument, ke kterému je přičleněn, je sám DOM HTML dokumentem, nebo pokud je výstupním formátem HTML.

Touto poněkud hutnější a různorodější kapitolou o XSLT zakončíme povídání o XML ve spojení s JavaScriptem. Příště se již přesuneme na stranu serveru - následující díl se bude nést ve znamení spolupráce PHP s XML.

Diskuze (3) Další článek: Neohlášený Celeron 2,3 GHz na českém trhu

Témata článku: Software, Programování, Internet Explorer, Java, Javascript, Stejný dotaz, Password, Společný jmenovatel, Textový řetězec, Doma, Counter, Teorie, Alert, XML, Element, Výsledné dílo, Pre, Fragment, Code, Transform

Určitě si přečtěte


Aktuální číslo časopisu Computer

Test 6 odolných telefonů a 22 powerbank

Srovnání technologií QLED a OLED

Měřte své sportovní výkony

Sady pro chytrou domácnost