最新的Web开发教程
 

XML DOM遍历节点树


遍历装置通过循环或跨节点树行驶。


遍历节点树

通常要循环的XML文档,例如:当你想提取每个元素的值。

这就是所谓的"Traversing the node tree"

下面的例子通过<书>的所有子节点循环,并显示它们的名称和值:

<!DOCTYPE html>
<html>
<body>

<p id="demo"></p>

<script>
var x, i ,xmlDoc;
var txt = "";
var text = "<book>" +
"<title>Everyday Italian</title>" +
"<author>Giada De Laurentiis</author>" +
"<year>2005</year>" +
"</book>";

parser = new DOMParser();
xmlDoc = parser.parseFromString(text,"text/xml");

// documentElement always represents the root node
x = xmlDoc.documentElement.childNodes;
for (i = 0; i < x.length ;i++) {
    txt += x[i].nodeName + ": " + x[i].childNodes[0].nodeValue + "<br>";
}
document.getElementById("demo").innerHTML = txt;
</script>

</body>
</html>

输出:

title: Everyday Italian
author: Giada De Laurentiis
year: 2005
试一试»

例子解释:

  1. 加载XML字符串载入xmlDoc
  2. 得到根元素的子节点
  3. 对于每个子节点,输出节点名称和文本节点的节点值

在DOM解析浏览器的差异

所有现代浏览器都支持W3C DOM规范。

但是,也有浏览器之间的一些差异。 一个重要的区别是:

  • 他们处理白色空间和新的生产线的方式

DOM - 白色空间和新线路

XML通常包含新行,或空格字符,节点之间。 这通常是当文档被简单的编辑器如记事本编辑的情况下。

下面的例子(edited by Notepad)包含CR / LF (new line)每一行,并在每个子节点的前面两个空间之间:

<book>
  <title>Everyday Italian</title>
  <author>Giada De Laurentiis</author>
  <year>2005</year>
  <price>30.00</price>
</book>

Internet Explorer 9的和更早的版本不把空的空白或换行作为文本节点,而其他浏览器做的。

下面的例子将输出孩子的节点数的根元素(of books.xml )了。 IE9和更早版本将输出4子节点,而IE10及更高版本,和其他浏览器将输出9子节点:

function myFunction(xml) {
var xmlDoc = xml.responseXML;
    x = xmlDoc.documentElement.childNodes;
    document.getElementById("demo").innerHTML =
    "Number of child nodes: " + x.length;
}
试一试»

PCDATA - 解析字符数据

XML解析器通常解析XML文档中的所有文本。

当XML元素被解析时,XML标签之间的文本也被解析:

<message>This text is also parsed</message>

解析器这是否因为XML元素可以包含其他元素,如在本实施例中,其中的<name>元素包含其它两个要素(first and last)

<name><first>Bill</first><last>Gates</last></name>

分析器将它分解成这样子元素:

<name>
  <first>Bill</first>
  <last>Gates</last>
</name>

经过分析的字符数据(PCDATA)是用于关于将由XML解析器解析的文本数据的术语。


CDATA - (Unparsed)字符数据

术语CDATA用于关于不应由XML解析器解析的文本数据。

字符,如"<""&"是XML元素是非法的。

"<"会因为解析器解释为新元素的开始产生错误。

"&"会因为解析器将其解释为一个字符实体的开始产生错误。

一些文字,像JavaScript代码,包含了很多的"<""&"字符。 为了避免错误的脚本代码可以被定义为CDATA。

CDATA节内的一切都被解析器忽略。

CDATA项开头" <![CDATA[ " and ends with " ]]> "

<script>
<![CDATA[
function matchwo(a,b) {
    if (a < b && a < 0) {
        return 1;
    } else {
        return 0;
    }
}
]]>
</script>

在上面的例子中,CDATA节内的一切都被解析器忽略。

Notes on CDATA sections:

一个CDATA部件不能包含字符串"]]>" 嵌套CDATA部分是不允许的。

"]]>"的标记CDATA节的结尾不能包含空格或换行符。