XML DOM - 王朝网络

XML DOM 定义了访问和处理 XML 文档的标准方法。

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

一、DOM 简介

什么是 DOM？

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

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

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

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

核心 DOM

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

XML DOM

用于 XML 文档的标准模型

HTML DOM

用于 HTML 文档的标准模型

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

什么是 HTML DOM？

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

什么是 XML DOM?

XML DOM 是：

用于 XML 的标准对象模型

用于 XML 的标准编程接口

中立于平台和语言

W3C 的标准

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

换句话说：

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

二、XML DOM 节点

文档中的每个成分都是一个节点。

节点

根据 DOM，XML 文档中的每个成分都是一个节点。

DOM 是这样规定的：

整个文档是一个文档节点

每个 XML 标签是一个元素节点

包含在 XML 元素中的文本

DOM 实例

请看下面的 XML 文件 (books.xml)：

======================================

<?xml version="1.0" encoding="ISO-8859-1"?>

<title lang="en">Everyday Italian</title>

<author>Giada De Laurentiis</author>

30.00</price>

</book>

<title lang="en">Harry Potter</title>

<author>J K. Rowling</author>

29.99</price>

</book>

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

49.99</price>

</book>

<title lang="en">Learning XML</title>

39.95</price>

</book>

</bookstore>

======================================

在上面的 XML 中，根节点是 <bookstore>。文档中的所有其他节点都被包含在 <bookstore> 中。

根节点 <bookstore> 有四个 <book> 节点。

第一个 <book> 节点有四个节点：<title>, <author>, <year> 以及，其中每个节点都包含一个文本节点，"Everyday Italian", "Giada De Laurentiis", "2005" 以及 "30.00"。

文本总是存储在文本节点中

在 DOM 处理中一个普遍的错误是，认为元素节点包含文本。

不过，元素节点的文本是存储在文本节点中的。

在这个例子中：<year>2005</year>，元素节点 <year>，拥有一个值为 "2005" 的文本节点。

"2005" 不是 <year> 元素的值！

三、XML DOM 节点树

XML DOM 把 XML DOM 文档视为一棵节点树 (node-tree)。

树中的所有节点彼此之间都有关系。

XML DOM 节点树

XML DOM 把 XML 文档视为一种树结构。这种树结构被称为节点树。

可通过这棵树访问所有节点。可以修改或删除它们的内容，也可以创建新的元素。

这颗节点树展示了节点的集合，以及它们之间的联系。这棵树从根节点开始，然后在树的最低层级向文本节点长出枝条

父、子和同级节点

节点树中的节点彼此之间都有等级关系。

父、子和同级节点用于描述这种关系。父节点拥有子节点，位于相同层级上的子节点称为同级节点（兄弟或姐妹）。

在节点树中，顶端的节点成为根节点

根节点之外的每个节点都有一个父节点

节点可以有任何数量的子节点

叶子是没有子节点的节点

同级节点是拥有相同父节点的节点

因为 XML 数据是按照树的形式进行构造的，所以可以在不了解树的确切结构且不了解其中包含的数据类型的情况下，对其进行遍历。

四、解析 XML DOM

大多数浏览器都内建了供读取和操作 XML 的 XML 解析器。

解析器把 XML 转换为 JavaScript 可存取的对象。

解析 XML

所有现代浏览器都内建了用于读取和操作 XML 的 XML 解析器。

解析器把 XML 读入内存，并把它转换为可被 JavaScript 访问的 XML DOM 对象。

微软的 XML 解析器与其他浏览器中的解析器是有差异的。微软的解析器支持对 XML 文件和 XML 字符串（文本）的加载，而其他浏览器使用单独的解析器。不过，所有的解析器都含有遍历 XML 树、访问、插入及删除节点的函数。

五、javascript操作xml

我们知道XML文档中，主要是元素节点、属性节点和文本节点。

下面详细介绍JavaScript是如何操作它们的。

元素节点：

查找：上一篇已介绍。主要是通过方法getElementsByTagName来查找定位。

例子：

//输出所有的titles

var t=xmlDoc.getElementsByTagName("title");

for (i=0;i<t.length;i++)

{

document.write(t.childNodes[0].nodeValue);

document.write("<br />");

}

添加：主要是用createElement创建元素，然后用appendChild附加子节点的形式实现。

例子：

var newNode=xmlDoc.createElement("New Element Name");//创建元素节点

var nodeBook =xmlDoc.getElementsByTagName("book")[0];//找到节点book

nodeBook.appendChild(newNode);//把newNode作为子节点追加到父节点book的子节点后面。也就是说，要追加节点，必须先找到父节点。

另外，还可以通过克隆的方式添加节点。

cloneNode() 方法有一个参数（true 或 false）。该参数指示被复制的节点是否包括原节点的所有属性和子节点。

例子：

oldNode=xmlDoc.getElementsByTagName('book')[0];

newNode=oldNode.cloneNode(true);// 克隆复制原节点以及所有属性和子节点

xmlDoc.documentElement.appendChild(newNode);

删除：父节点调用removeChild实现。

例如：

var nodeBook=xmlDoc.getElementsByTagName("book")[0];//找到节点book

xmlDoc.documentElement.removeChild(nodeBook);//删除根节点下面的第一个book节点

注意：删除某个节点，它下面的子节点也会被同时删除。

修改：不允许直接修改元素。若真要修改可以用replaceChild间接完成。

语法是: parentNode. replaceChild(newNode,oldNode)

另外，元素没有nodeValue。若要修改元素内的文本，如修改<title>hello</title>里的hello，可参考下面的操作文本节点。

文本节点：

查找：查找文本节点不能直接用getElementsByTagName,而是先用它找到元素节点，然后再用childNodes[0]或firstChild来定位文本节点（因为它是以元素节点的第一个子节点的形式存在的），接着再用nodeValue即可得到文本内容。

例子：

var nodeTitle=xmlDoc.getElementsByTagName("title")[0];

var titleTextNode=nodeTitle.childNodes[0];//也可以用firstChild

var theTxt=titleTextNode.nodeValue;

添加：类似于元素的添加方式，但文本的添加是通过createTextNode创建的(note:在XHTML也可以用innerHTML的方式添加)。

例子：

var edition=xmlDoc.createElement("edition");

var newtext=xmlDoc.createTextNode("this is first");

edition.appendChild(newtext);//在操作XHTML时, 上面这两行可直接用edition.innerHTML=’ this is first’代替;

var nodeBook=xmlDoc.getElementsByTagName("book")[0];

nodeBook.appendChild(edition);

删除：父节点调用removeChild实现。当然也可以用清空nodeValue的方式实现。如textNode.nodeValue=’’。

修改：textNode.nodeValue=’修改成你想要的文本内容’。

另外，文本节点的修改也可以用replaceData()替换文本节点中的数据。

replaceData() 方法有三个参数：

offset - 在何处开始替换字符。Offset 值以 0 开始。

length - 要替换多少字符。，

string - 要插入的字符串。

例子：

xmlDoc.getElementsByTagName("title")[0].childNodes[0].replaceData(0,8,"hello");

//note:其实完全可以用substr或者substring事先处理字符串，再赋值给nodeValue

属性节点：

查找：与元素节点不同，属性节点拥有文本值。获取属性的值的方法，就是获取它的文本值。可以通过使用 getAttribute() 方法或属性节点的 nodeValue 属性来完成这个任务。

例子：

xmlDoc.getElementsByTagName("title")[0].getAttribute("lang");//return “en”

或者

xmlDoc.getElementsByTagName("title")[0].getAttributeNode("lang"). nodeValue; //return “en”

添加：用setAttribute或者setAttributeNode实现。

例子：

xmlDoc.getElementsByTagName('book')[0].setAttribute("edition","this is first");

或者

var newAtt=xmlDoc.createAttribute("edition");

newAtt.nodeValue="this is first first";

xmlDoc.getElementsByTagName("title")[0].setAttributeNode(newAtt);

删除：可用removeAttribute(name)或者removeAttributeNode(node)

例子：

//方式1：removeAttribute

//删除第一个 <book> 元素中的 "category" 属性：

xmlDoc.getElementsByTagName("book")[0].removeAttribute("category");

//方式2：removeAttributeNode

//删除所有 <book> 元素的所有属性

x=xmlDoc.getElementsByTagName("book");

for (i=0;i<x.length;i++)

{

while (x.attributes.length>0)

{

attnode=x.attributes[0];

old_att=x.removeAttributeNode(attnode);

}

修改：通过使用 setAttribute() 方法或属性节点的 nodeValue 属性来完成。

例子：

// setAttribute

xmlDoc.getElementsByTagName('book')[0].setAttribute("category","child");

//set nodeValue

var x=xmlDoc.getElementsByTagName("book")[0]

var y=x.getAttributeNode("category");

y.nodeValue="child";