XML DOM - 访问节点


通过 DOM,您能够访问 XML 文档中的每个节点。

在线实例

下面的实例使用 XML 文件 books.xml。

<?xml version="1.0" encoding="utf-8"?>

<bookstore>
  <book category="cooking">
    <title>Everyday Italian</title>
    <author>Giada De Laurentiis</author>
    <year>2005</year>
    <price>30.00</price>
  </book>
  <book category="children">
    <title>Harry Potter</title>
    <author>J K. Rowling</author>
    <year>2005</year>
    <price>29.99</price>
  </book>
  <book category="web">
    <title>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>
  <book category="web" cover="paperback">
    <title>Learning XML</title>
    <author>Erik T. Ray</author>
    <year>2003</year>
    <price>39.95</price>
  </book>
</bookstore>

函数 loadXMLDoc(),位于外部 JavaScript 中,用于加载 XML 文件。

使用节点列表中的索引号来访问节点
本例使用 getElementsByTagname() 方法来获取 "books.xml" 中的第三个 <title> 元素。

<!DOCTYPE html>
<html>
<head>
<script src="loadxmldoc.js"></script>
</head>
<body>

<script>

xmlDoc=loadXMLDoc("books.xml");
x=xmlDoc.getElementsByTagName("title");
document.write(x[2].childNodes[0].nodeValue);

</script>
</body>
</html>

使用 length 属性来遍历节点
本例使用 length 属性来遍历 "books.xml" 中的所有 <title> 元素。

<!DOCTYPE html>
<html>
<head>
<script src="loadxmldoc.js"></script>
</head>
<body>

<script>
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>");
  }
</script>
</body>
</html>

查看元素的节点类型
本例使用 nodeType 属性来获取 "books.xml" 中根元素的节点类型。

<!DOCTYPE html>
<html>
<head>
<script src="loadxmldoc.js"></script>
</head>
<body>

<script>
xmlDoc=loadXMLDoc("books.xml");

document.write(xmlDoc.documentElement.nodeName);
document.write("<br>");
document.write(xmlDoc.documentElement.nodeType);
</script>
</body>
</html>

遍历元素节点
本例使用 nodeType 属性来处理 "books.xml" 中的元素节点。

<!DOCTYPE html>
<html>
<head>
<script src="loadxmldoc.js"></script>
</head>
<body>

<script>
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>");
  } 
}
</script>
</body>
</html>

使用节点的关系来遍历元素节点
本例使用 nodeType 属性和 nextSibling 属性来处理 "books.xml" 中的元素节点。

<!DOCTYPE html>
<html>
<head>
<script src="loadxmldoc.js"></script>
</head>
<body>

<script>
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;
}
</script>
</body>
</html>

访问节点

您可以通过三种方式来访问节点:

1. 通过使用 getElementsByTagName() 方法。

2. 通过循环(遍历)节点树。

3. 通过利用节点的关系在节点树中导航。

getElementsByTagName() 方法

getElementsByTagName() 返回拥有指定标签名的所有元素。

语法

node.getElementsByTagName("tagname");

实例

下面的实例返回 x 元素下的所有 <title> 元素:

x.getElementsByTagName("title");

请注意,上面的实例仅返回 x 节点下的 <title> 元素。如需返回 XML 文档中的所有 <title> 元素,请使用:

xmlDoc.getElementsByTagName("title");

在这里,xmlDoc 就是文档本身(文档节点)。

DOM 节点列表(Node List)

getElementsByTagName() 方法返回节点列表。节点列表是节点的数组。

下面的代码使用 loadXMLDoc() 把 "books.xml" 载入 xmlDoc 中,然后在变量 x 中存储 <title> 节点的一个列表:

xmlDoc=loadXMLDoc("books.xml");

x=xmlDoc.getElementsByTagName("title");

可通过索引号访问 x 中的 <title> 元素。如需访问第三个 <title>,您可以编写:

y=x[2];

注意:该索引从 0 开始。

在本教程后面的章节中,您将学习更多有关节点列表(Node List)的知识。

DOM 节点列表长度(Node List Length)

length 属性定义节点列表的长度(即节点的数量)。

您可以通过使用 length 属性来遍历节点列表:

实例

<!DOCTYPE html>
<html>
<head>
<script src="loadxmldoc.js"></script>
</head>
<body>

<script>
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>");
 }
</script>
</body>
</html>
 

实例解释:

  1. 使用 loadXMLDoc() 把 "books.xml" 载入 xmlDoc 中
  2. 获取所有 <title> 元素节点
  3. 输出每个 <title> 元素的文本节点的值

节点类型(Node Types)

XML 文档的 documentElement 属性石根节点。

节点的 nodeName 属性是节点的名称。

节点的 nodeType 属性是节点的类型。

您将在本教程的下一章中学习更多有关节点属性的知识。

<!DOCTYPE html>
<html>
<head>
<script src="loadxmldoc.js"></script>
</head>
<body>

<script>
xmlDoc=loadXMLDoc("books.xml");

document.write(xmlDoc.documentElement.nodeName);
document.write("<br>");
document.write(xmlDoc.documentElement.nodeType);
</script>
</body>
</html>

遍历节点

下面的代码遍历根节点的子节点,同时也是元素节点:

实例

<!DOCTYPE html>
<html>
<head>
<script src="loadxmldoc.js"></script>
</head>
<body>

<script>
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>");
 }
}
</script>
</body>
</html>

实例解释:

  1. 使用 loadXMLDoc() 把 "books.xml" 载入 xmlDoc 中
  2. 获取根元素的子节点
  3. 检查每个子节点的节点类型。如果节点类型是 "1",则是元素节点
  4. 如果是元素节点,则输出节点的名称

导航节点的关系

下面的代码使用节点关系导航节点树:

实例

<!DOCTYPE html>
<html>
<head>
<script src="loadxmldoc.js"></script>
</head>
<body>

<script>
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;
}
</script>
</body>
</html>

  1. 使用 loadXMLDoc() 把 "books.xml" 载入 xmlDoc 中
  2. 获取第一个 book 元素的子节点
  3. 把 "y" 变量设置为第一个 book 元素的第一个子节点
  4. 对于每个子节点(第一个子节点从 "y" 开始),检查节点类型,如果节点类型为 "1",则是元素节点
  5. 如果是元素节点,则输出该节点的名称
  6. 把 "y" 变量设置为下一个同级节点,并再次运行循环