通过 DOM,您能够访问 XML 文档中的每个节点。
下面的例子使用 XML 文件 books.xml。
函数 loadXMLDoc(),位于外部 JavaScript 中,用于加载 XML 文件。
使用节点列表中的下标号来访问节点
本例使用 getElementsByTagname() 方法来获得 “books.xml” 中的第三个 <title> 元素。
<html> <head> <script type="text/javascript" src="/example/xdom/loadxmldoc.js"></script> </head> <body> <script type="text/javascript"> xmlDoc=loadXMLDoc("/example/xdom/books.xml"); x=xmlDoc.getElementsByTagName("title"); document.write(x[2].childNodes[0].nodeValue); </script> </body> </html>
使用 length 属性来循环节点
本例使用 length 属性来循环 “books.xml” 中的所有 <title> 元素。
<html> <head> <script type="text/javascript" src="/example/xdom/loadxmldoc.js"></script> </head> <body> <script type="text/javascript"> xmlDoc=loadXMLDoc("/example/xdom/books.xml"); x=xmlDoc.getElementsByTagName("title"); for (i=0;i<x.length;i++) { document.write(x[i].childNodes[0].nodeValue); document.write("<br />"); } </script> </body> </html>
查看元素的节点类型
本例使用 nodeType 属性来获得 “books.xml” 中根元素的节点类型。
<html> <head> <script type="text/javascript" src="/example/xdom/loadxmldoc.js"></script> </head> <body> <script type="text/javascript"> xmlDoc=loadXMLDoc("/example/xdom/books.xml"); document.write(xmlDoc.documentElement.nodeName); document.write("<br />"); document.write(xmlDoc.documentElement.nodeType); </script> </body> </html>
循环元素节点
本例使用 nodeType 属性来处理 “books.xml” 中的元素节点。
<html> <head> <script type="text/javascript" src="/example/xdom/loadxmldoc.js"></script> </head> <body> <script type="text/javascript"> xmlDoc=loadXMLDoc("/example/xdom/books.xml"); x=xmlDoc.documentElement.childNodes; for (i=0;i<x.length;i++) { if (x[i].nodeType==1) {//Process only element nodes (type 1) document.write(x[i].nodeName); document.write("<br />"); } } </script> </body> </html>
使用节点的关系来循环元素节点
本例使用 nodeType 属性和 nextSibling 属性来处理 “books.xml” 中的元素节点。
<html> <head> <script type="text/javascript" src="/example/xdom/loadxmldoc.js"></script> </head> <body> <script type="text/javascript"> xmlDoc=loadXMLDoc("/example/xdom/books.xml"); x=xmlDoc.getElementsByTagName("book")[0].childNodes; y=xmlDoc.getElementsByTagName("book")[0].firstChild; for (i=0;i<x.length;i++) { if (y.nodeType==1) {//Process only element nodes (type 1) document.write(y.nodeName + "<br />"); } y=y.nextSibling; } </script> </body> </html>
您可以通过三种方法来访问节点:
getElementsByTagName() 返回拥有指定标签名的所有元素。
node.getElementsByTagName("tagname");
下面的例子返回 x 元素下的所有 <title> 元素:
x.getElementsByTagName("title");
请注意,上面的例子仅返回 x 节点下的 <title> 元素。要返回 XML 文档中的所有 <title> 元素,请使用:
xmlDoc.getElementsByTagName("title");
在这里,xmlDoc 就是文档本身(文档节点)。
getElementsByTagName() 方法返回节点列表 (node list)。节点列表是节点的数组。
下面的代码通过使用 loadXMLDoc() 把 “books.xml” 载入 xmlDoc 中,然后在变量 x 中存储 <title> 节点的一个列表:
xmlDoc=loadXMLDoc("books.xml"); x=xmlDoc.getElementsByTagName("title");
可通过下标访问 x 中的 <title> 元素。要访问第三个 <title>,您可以编写:
y=x[2];
<html> <head> <script type="text/javascript" src="/example/xdom/loadxmldoc.js"></script> </head> <body> <script type="text/javascript"> xmlDoc=loadXMLDoc("/example/xdom/books.xml"); x=xmlDoc.getElementsByTagName("title"); document.write(x[2].childNodes[0].nodeValue); </script> </body> </html>
注释:下标以 0 起始。
在本教程中稍后的章节,您将学到更多有关 Node List 的知识。
length 属性定义节点列表的长度(即节点的数目)。
您能够通过使用 length 属性来循环一个节点列表:
xmlDoc=loadXMLDoc("books.xml"); x=xmlDoc.getElementsByTagName("title"); for (i=0;i<x.length;i++) { document.write(x[i].childNodes[0].nodeValue); document.write("<br />"); }
<html> <head> <script type="text/javascript" src="/example/xdom/loadxmldoc.js"></script> </head> <body> <script type="text/javascript"> xmlDoc=loadXMLDoc("/example/xdom/books.xml"); x=xmlDoc.getElementsByTagName("title"); for (i=0;i<x.length;i++) { document.write(x[i].childNodes[0].nodeValue); document.write("<br />"); } </script> </body> </html>
XML 文档的 documentElement 属性是根节点。
节点的 nodeName 属性是节点的名称。
节点的 nodeType 属性是节点的类型。
您将在本教程的下一节中学习更多有关节点属性的知识。
<html> <head> <script type="text/javascript" src="/example/xdom/loadxmldoc.js"></script> </head> <body> <script type="text/javascript"> xmlDoc=loadXMLDoc("/example/xdom/books.xml"); document.write(xmlDoc.documentElement.nodeName); document.write("<br />"); document.write(xmlDoc.documentElement.nodeType); </script> </body> </html>
下面的代码循环根节点的子节点,同时也是元素节点:
xmlDoc=loadXMLDoc("books.xml"); x=xmlDoc.documentElement.childNodes; for (i=0;i<x.length;i++) { if (x[i].nodeType==1) {//Process only element nodes (type 1) document.write(x[i].nodeName); document.write("<br />"); } }
<html> <head> <script type="text/javascript" src="/example/xdom/loadxmldoc.js"></script> </head> <body> <script type="text/javascript"> xmlDoc=loadXMLDoc("/example/xdom/books.xml"); x=xmlDoc.documentElement.childNodes; for (i=0;i<x.length;i++) { if (x[i].nodeType==1) {//Process only element nodes (type 1) document.write(x[i].nodeName); document.write("<br />"); } } </script> </body> </html>
下面的代码通过利用节点的关系在节点树中进行导航:
xmlDoc=loadXMLDoc("books.xml"); x=xmlDoc.getElementsByTagName("book")[0].childNodes; y=xmlDoc.getElementsByTagName("book")[0].firstChild; for (i=0;i<x.length;i++) { if (y.nodeType==1) {//Process only element nodes (type 1) document.write(y.nodeName + "<br />"); } y=y.nextSibling; }
<html> <head> <script type="text/javascript" src="/example/xdom/loadxmldoc.js"></script> </head> <body> <script type="text/javascript"> xmlDoc=loadXMLDoc("/example/xdom/books.xml"); x=xmlDoc.getElementsByTagName("book")[0].childNodes; y=xmlDoc.getElementsByTagName("book")[0].firstChild; for (i=0;i<x.length;i++) { if (y.nodeType==1) {//Process only element nodes (type 1) document.write(y.nodeName + "<br />"); } y=y.nextSibling; } </script> </body> </html>