XML DOM学习

XML 文档对象模型定义访问和操作XML文档的标准方法。

XML DOM 是 XML Document Object Model 的缩写，即 XML 文档对象模型。

DOM 将 XML 文档作为一个树形结构，而树叶被定义为节点。

1、什么是 DOM？

DOM 是 W3C（万维网联盟） 的推荐标准。

DOM 定义了访问诸如 XML 和 XHTML 文档的标准。

“W3C 文档对象模型（DOM）是一个使程序和脚本有能力动态地访问和更新文档的内容、结构以及样式的平台和语言中立的接口。”

W3C DOM 被分为 3 个不同的部分/级别（parts / levels）：

核心 DOM

用于任何结构化文档的标准模型

XML DOM

用于 XML 文档的标准模型

HTML DOM

用于 HTML 文档的标准模型

DOM 定义了所有文档元素的对象和属性，以及访问它们的方法（接口）。

XML DOM 是用于获取、更改、添加或删除 XML 元素的标准。

2、解析 XML DOM

通过微软的 XML 解析器加载 XML

微软的 XML 解析器内建于 Internet Explorer 5 及更高版本中。

下面的 JavaScript 片段把 XML 文档 ("books.xml") 载入了解析器：

xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
xmlDoc.async="false";
xmlDoc.load("books.xml");

代码解释：

• 第一行创建空的微软 XML 文档对象
• 第二行关闭异步加载，这样可确保在文档完整加载之前，解析器不会继续执行脚本
• 第三行告知解析器加载名为 "books.xml" 的文档

下面的 JavaScript 片段把名为 txt 的字符串载入解析器中：

xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
xmlDoc.async="false";
xmlDoc.loadXML(txt);

注释：loadXML() 方法用于加载字符串（文本），而 load() 用于加载文件。

---

 

在 Firefox 及其他浏览器中的 XML 解析器

下面的 JavaScript 片段把 XML 文档 ("books.xml") 载入了解析器：

xmlDoc=document.implementation.createDocument("","",null);
xmlDoc.async="false";
xmlDoc.load("books.xml");

代码解释：

• 第一行创建空的 XML 文档对象
• 第二行关闭异步加载，这样可确保在文档完整加载之前，解析器不会继续执行脚本
• 第三行告知解析器加载名为 "books.xml" 的文档

下面的 JavaScript 片段把名为 txt 的字符串载入解析器中：

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

代码解释：

• 第一行创建一个空的 XML 文档对象
• 第二行告知解析器加载名为 txt 的字符串

注释：Internet Explorer 使用 loadXML() 方法来解析 XML 字符串，而其他浏览器使用 DOMParser 对象。

---

 

XML DOM 属性

一些典型的 DOM 属性：

• x.nodeName - x 的名称
• x.nodeValue - x 的值
• x.parentNode - x 的父节点
• x.childNodes - x 的子节点
• x.attributes - x 的属性节点

注释：在上面的列表中，x 是一个节点对象。

XML DOM 方法

• x.getElementsByTagName(name) - 获取带有指定标签名称的所有元素
• x.appendChild(node) - 向 x 插入子节点
• x.removeChild(node) - 从 x 删除子节点

注释：在上面的列表中，x 是一个节点对象。

---

实例

从 books.xml 中的 <title> 元素获取文本的 JavaScript 代码：

txt=xmlDoc.getElementsByTagName("title")[0].childNodes[0].nodeValue

在此语句执行后，txt 保存的值是 "Harry Potter"。

解释：

• xmlDoc - 由解析器创建的 XML DOM
• getElementsByTagName("title")[0] - 第一个 <title> 元素
• childNodes[0] - <title> 元素的第一个子节点 (文本节点)
• nodeValue - 节点的值 (文本自身)

在上面的例子中，getElementsByTagName 是方法，而 childNodes 和 nodeValue 是属性。

---

解析 XML 文件 - 跨浏览器实例

下面的代码片段使用 loadXMLDoc 函数把 books.xml 载入 XML 解析器中，并显示第一个 book 的数据：

xmlDoc=loadXMLDoc("books.xml");

document.write(xmlDoc.getElementsByTagName("title")
[0].childNodes[0].nodeValue);
document.write("<br />");
document.write(xmlDoc.getElementsByTagName("author")
[0].childNodes[0].nodeValue);
document.write("<br />");
document.write(xmlDoc.getElementsByTagName("year")
[0].childNodes[0].nodeValue);

输出：

Harry Potter
J K. Rowling
2005

---

3、XML DOM 访问节点

访问节点

您可以通过三种方法来访问节点：

1. 通过使用 getElementsByTagName() 方法
2. 通过循环（遍历）节点树
3. 通过利用节点的关系在节点树中导航

---

实例

下面的例子返回 x 元素下的所有 <title> 元素：

x.getElementsByTagName("title");

请注意，上面的例子仅返回 x 节点下的 <title> 元素。要返回 XML 文档中的所有 <title> 元素，请使用：

xmlDoc.getElementsByTagName("title");

在这里，xmlDoc 就是文档本身（文档节点）。

---

DOM Node List

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

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

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

---

Node Type

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

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

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

利用节点的关系进行导航

下面的代码通过利用节点的关系在节点树中进行导航：

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;
}

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

4、XML DOM 节点信息

节点属性：nodeName、nodeValue 以及 nodeType。

nodeName 属性

nodeName 属性规定节点的名称。

• nodeName 是只读的
• 元素节点的 nodeName 与标签名相同
• 属性节点的 nodeName 是属性的名称
• 文本节点的 nodeName 永远是 #text
• 文档节点的 nodeName 永远是 #document

nodeValue 属性

nodeValue 属性规定节点的值。

• 元素节点的 nodeValue 是 undefined
• 文本节点的 nodeValue 是文本自身
• 属性节点的 nodeValue 是属性的值

nodeType 属性

nodeType 属性规定节点的类型。

nodeType 是只读的。

最重要的节点类型是：

元素类型	节点类型
元素	1
属性	2
文本	3
注释	8
文档	9

5、XML DOM 定位节点

可通过使用节点间的关系对节点进行定位。

定位 DOM 节点

通过节点间的关系访问节点树中的节点，通常称为定位节点 （"navigating nodes"）。

在 XML DOM 中，节点的关系被定义为节点的属性：

• parentNode
• childNodes
• firstChild
• lastChild
• nextSibling
• previousSibling

---

避免空的文本节点

Firefox，以及其他一些浏览器，把空的空白或换行当作文本节点，而 IE 不会这么做。

这会在使用下列属性使产生一个问题：firstChild、lastChild、nextSibling、previousSibling。

为了避免定位到空的文本节点（元素节点之间的空格和换行符号），我们使用一个函数来检查节点的类型：

function get_nextSibling(n)
{
y=n.nextSibling;
while (y.nodeType!=1)
  {
  y=y.nextSibling;
  }
return y;
}

有了上面的函数，我们就可以使用 get_nextSibling(node) 来代替 node.nextSibling 属性。

代码解释：

元素节点的类型是 1。如果同级节点不是元素节点，就移动到下一个节点，直到找到元素节点为止。通过这个办法，在 IE 和 Firefox 中，都可以得到相同的结果。