各个浏览器在实现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);
}