各個瀏覽器在實現XML DOM的細節上有所不同:
- 解析XML的具體實現不同
- IE使用的更多的是ActiveXObject來對XML進行解析,具體根據解析類型使用load和loadXML方法實現;
- Firefox、Mozilla、Opera等瀏覽器使用DOMParser來解析XML字符串;用document.implementation.createDocument方法來創建空的XML對象,使用load方法裝載實際對象;(async設置為false,將關閉異步加載,意即文檔加載完畢之前解析器不會繼續執行腳本)
- Chrome中沒有實現load方法,只能通過XMLHttpRequest(目前我所知)來裝載XML文檔,即使用AJAX方法請求對應XML文檔,然后responseXML中獲取documentElement(XML根元素);(一種說法是這樣只能通過HTTP協議訪問,不能通過File協議,否則會報錯)
- 處理換行和空白的方式不同
Firefox以及其他一些瀏覽器,會把空的空白或換行作為文本節點來處理,而IE會忽略空白和換行。
對下述XML的根元素進行遍歷輸出其子元素的nodeName和nodeValue,在IE和其他瀏覽器中有不同結果:
<?xml version="1.0" encoding="ISO-8859-1" ?>
<!-- Copyright w3school.com.cn -->
<!-- W3School.com.cn bookstore example -->
<bookstore>
<book category="children">
<title lang="en">Harry Potter</title>
<author>J K. Rowling</author>
<year>2005</year>
<price>29.99</price>
</book>
<book category="cooking">
<title lang="en">Everyday Italian</title>
<author>Giada De Laurentiis</author>
<year>2005</year>
<price>30.00</price>
</book>
<book category="web" cover="paperback">
<title lang="en">Learning XML</title>
<author>Erik T. Ray</author>
<year>2003</year>
<price>39.95</price>
</book>
<book category="web">
<title lang="en">XQuery Kick Start</title>
<author>James McGovern</author>
<author>Per Bothner</author>
<author>Kurt Cagle</author>
<author>James Linn</author>
<author>Vaidyanathan Nagarajan</author>
<year>2003</year>
<price>49.99</price>
</book>
</bookstore>
- IE :
x = xmlDoc.documentElement.childNodes;
console.log(xmlDoc.documentElement.nodeName);
console.log(xmlDoc.documentElement.nodeValue);
for(var i = 0;i<x.length;i++){
console.log(i);
console.log(x[i].nodeName);
console.log(x[i].nodeValue);
}
- Chrome:
var xhr = new XMLHttpRequest();
xhr.open('GET','/example/xdom/books.xml',false);
xhr.send();
var xmlDoc = xhr.responseXML;
x = xmlDoc.documentElement.childNodes;
console.log(xmlDoc.documentElement.nodeName);
console.log(xmlDoc.documentElement.nodeValue);
for(var i = 0;i<x.length;i++){
console.log(i);
console.log(x[i].nodeName);
console.log(x[i].nodeValue);
}
- Firefox:
x=xmlDoc.documentElement.childNodes;
console.log('x.n: '+x.nodeName);
console.log('x.v: '+x.nodeValue);
for(var i=0;i<x.length;i++){
console.log(i);
console.log(x[i].nodeName);
console.log(x[i].nodeValue);
}