prezentace

Zpracování XML v
prohlížečích
Jiří Matějka
Jakub Jelínek
Osnova
1. XPath v Javascriptu
 2. Parsing a serializace
 3. E4X

XPath v Javascriptu
 DOM 3 XPath – W3C Working Group
Note (2004)
 XPathEvaluator
 metoda evaluate
 vrací objekt typu XPathResult
XPathEvaluator
získání instance:
 var eval = new XPathEvaluator();
 eval.evaluate()
 document.evaluate
metoda evaluate()
evaluate(xpathExpression, contextNode,
namespaceResolver, resultType, result)
 contextNode – kontextový uzel
 namespaceResolver – funkce: namespace ->
URI
 XPathExpression.createNSResolver() nebo null
 resultType – konstanta, určuje jaký typ chceme
vrátit (dále)
 result – objekt XPathResult pro opětovné použití
Konstanty návratového
typu
 možné typy výsledku: uzel, množina uzlů,
boolean, string, number

BOOLEAN_TYPE

NUMBER_TYPE

STRING_TYPE

ANY_UNORDERED_NODE_TYPE

FIRST_ORDERED_NODE_TYPE

ORDERED_NODE_ITERATOR_TYPE

UNORDERED_NODE_ITERATOR_TYPE

ORDERED_NODE_SNAPSHOT_TYPE

UNORDERED_NODE_SNAPSHOT_TYPE

ANY_TYPE
Příklad
var paragraphCount =
document.evaluate('count(//p)', document, null,
XPathResult.NUMBER_TYPE, null);
alert( 'This document contains ' +
paragraphCount.numberValue + ' paragraph elements' );
Podrobnosti
 ITERATOR vs. SNAPSHOT
 iterátor se může zneplatnit při změně
dokumentu
 ORDERED vs. UNORDERED
 ORDERED v pořadí uvedení v
dokumentu
XPathResult –
atributy,metody
 zapouzdřuje výsledek
 konstanty také patří sem
int
resultType - NUMBER_TYPE, ...
boolean
invalidIteratorState
boolean
booleanValue
double
numberValue
string
stringValue
Node
singleNodeValue
Node
iterateNext()
int
snapshotLength
Node
snapshotItem(int index)
Příklad
var iterator = document.evaluate('//phoneNumber', documentNode, null,
XPathResult.UNORDERED_NODE_ITERATOR_TYPE, null );
try {
var thisNode = iterator.iterateNext();
while (thisNode) {
alert( thisNode.textContent );
thisNode = iterator.iterateNext();
}
}
catch (e) {
dump('Error: Document tree modified during iteration' + e );
}
Podpora
 Firefox(3), Opera(9.5), Chrome(1), Safari
 IE ne, možnosti:
 použít z knihovny MSXML metody
 selectSingleNode, selectNodes
 Javascript XPath knihovny
 LlamaLab http://llamalab.com/js/xpath
 Google AJAXSLT http://goog-ajaxslt.sourceforge.net
Parsing a serializace XML

Převod do/z DOM reprezentace
Do/ze souboru
 Do/z řetězce


Potřeba různého kódu
Pro Internet Explorer
 Pro ostatní prohlížeče
Document Object Model Load and Save –
W3C Recommendation 2001


Načtení ze souboru

Internet Explorer
xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
xmlDoc.async = false;
xmlDoc.load("file.xml");

Ostatní
XmlDoc = document.implementation.
createDocument("","",null);
xmlDoc.async = false;
xmlDoc.load("file.xml");
Načtení z řetězce

Internet Explorer
xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
xmlDoc.async = false;
xmlDoc.loadXML("<root>...</root>");

Ostatní
parser = new DOMParser();
xmlDoc = parser.parseFromString(
"<root>...</root>",
"text/xml");
Použití
•
•
•
•
xmlDoc.getElementsByTagName
xmlDoc.childNodes(0).getAttribute("id")
xmlDoc.createAttribute
xmlDoc.appendChild
• httpRequest = new XMLHttpRequest();
• httpRequest.responseXML
Uložení (serializace)

Do souboru

Metoda save()
• xmlDoc.save("C:\Temp\newAlbums.xml")

Do řetězce (pouze IE)
 Vlastnost xml
• var xmlText = objXMLDoc.xml;
E4X

E4X = ECMAScript for XML


Standard ECMA-357


Standardní rozšíření JavaScriptu pro práci s
XML
Prosinec 2005 (druhá verze)
Podpora v prohlížečích



Mozilla Firefox 1.5+
Pro IE existuje knihovna IEE4X
ActionScript 3+
Vytvoření objektu

Přiřazení „inline“


var way_one = <my first='e4x'>
<some other='tag'/></my>;
Použití konstruktoru

var way_two = new XML(
"<my second='e4x'>Hallo!</my>");
Vytvoření objektu II

Parametry v „inline“ zápisu
Atributy bez uvozovek
var attr = 42;
var text = "Hallo world";
var foo = <foo rand='27' />;
var x = <say p={attr}>{text}{foo}
</say>;
 JavaScriptové výrazy
•var x = <say p={attr + text}>

Použití XML objektu


Potomek nebo více potomků

. nebo [] (stejný význam)

person.name
Atributy mají prefix @


~ person['name']
person.likes.@since
child(int) ~ [int]

person.likes.child(1) ~ person.likes[1]
var person = <person>...</person>
Užitečné funkce

text()

Bez XML tagů
toXMLString()
 copy()


Hluboká kopie
Seznamy XML uzlů
length()
 Iterace



Přidání do seznamu


for each (var x in person.likes)
person.likes += <pizza/>
Prázdný seznam

var empty = <></>
Predikáty

Do kulatých závorek


people.person.(name == "Joe").age
Použití JS funkcí
function over40(i) {
return i > 40;
}
 people.person.
(over40(parseInt(age))).name
(parseInt(age))

Úprava XML

Změny hodnot přiřazením


Přidávání nových uzlů


Přiřazením hodnoty neexistujícímu
atributu atritut vznikne
+= jako u seznamů
Operátor delete
Úprava XML - příklad
person.name = "Jakub Jelínek";
person.likes.os.@since = 2004;
person.likes.os.@new_attribute = 'foo';
person.likes.*[2] += <foo/>;
person.likes += <foo/>;
delete
delete
delete
delete
order.customer.address;
order.customer.@id;
order.item[0].price[0];
order.item;
person..*.length()
Zdroje
Introduction to using XPath in JavaScript, Mozilla Developer
Center,
https://developer.mozilla.org/en/Introduction_to_using_XPath_in
_JavaScript
XML DOM Tutorial, W3C Schools,
http://www.w3schools.com/DOM/default.asp
E4X Tutorial, W3C Schools,
http://www.w3schools.com/e4x/default.asp