XML DOM 是：
- 用于 XML 的标准对象模型
- 用于 XML 的标准编程接口
- 中立于平台和语言
- W3C 的标准
XML DOM 定义了所有 XML 元素的对象和属性，以及访问它们的方法（接口）。
换句话说：
XML DOM 是用于获取、更改、添加或删除 XML 元素的标准
节点
根据 DOM，XML 文档中的每个成分都是一个节点。
DOM 是这样规定的：
- 整个文档是一个文档节点
- 每个 XML 标签是一个元素节点
- 包含在 XML 元素中的文本是文本节点
- 每一个 XML 属性是一个属性节点
- 注释属于注释节点
文本总是存储在文本节点中
在 DOM 处理中一个普遍的错误是，认为元素节点包含文本。
不过，元素节点的文本是存储在文本节点中的。
在这个例子中：<year>2005</year>，元素节点 <year>，拥有一个值为 "2005" 的文本节点。
"2005" 不是 <year> 元素的值！
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 是一个节点对象。
我们为每个文本节点使用 childNodes[0]，即使每个元素只有一个文本节点。这是由于 getElementsByTagName() 方法总是会返回数组
nodeName 属性
nodeName 属性规定节点的名称。
- nodeName 是只读的
- 元素节点的 nodeName 与标签名相同
- 属性节点的 nodeName 是属性的名称
- 文本节点的 nodeName 永远是 #text
- 文档节点的 nodeName 永远是 #document
nodeType 属性
nodeType 属性规定节点的类型。
nodeType 是只读的。
最重要的节点类型是：
| 元素类型 | 节点类型 |
|---|---|
| 元素 | 1 |
| 属性 | 2 |
| 文本 | 3 |
| 注释 | 8 |
| 文档 | 9 |
DOM Node List
当使用诸如 childNodes 或 getElementsByTagName() 属性或方法时，会返回 NodeList 对象。
NodeList 对象表示节点的列表，以 XML 中的相同顺序。
遍历一棵节点树
<html>
<head>
<script type="text/javascript" src="/example/xdom/loadxmlstring.js"></script>
</head>
<body>
<script type="text/javascript">
text="<book>";
text=text+"<title>Harry Potter</title>";
text=text+"<author>J K. Rowling</author>";
text=text+"<year>2005</year>";
text=text+"</book>";
xmlDoc=loadXMLString(text);
// documentElement always represents the root node
x=xmlDoc.documentElement.childNodes;
for (i=0;i<x.length;i++)
{
document.write(x[i].nodeName);
document.write(": ");
document.write(x[i].childNodes[0].nodeValue);
document.write("<br />");
}
</script>
</body>
</html>
定位 DOM 节点
通过节点间的关系访问节点树中的节点，通常称为定位节点 （"navigating nodes"）。
在 XML DOM 中，节点的关系被定义为节点的属性：
- parentNode
- childNodes
- firstChild
- lastChild
- nextSibling
- previousSibling
-
获取节点的父节点
- 本例使用 parentNode 属性来获取节点的父节点。 获取节点的首个子节点
- 本例使用 firstChild() 方法和一个自定义函数来获取一个节点的首个子节点。
避免空的文本节点
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 属性。
通过使用 setAttribute 来改变属性的值
XML DOM 删除节点
removeChild() 方法删除指定节点。
removeAttribute() 方法删除指定属性。
-
删除元素节点
- 本例使用 removeChild() 来删除第一个 <book> 元素。 删除当前元素节点
- 本例使用 parentNode 和 removeChild() 来删除当前的 <book> 元素。 删除文本节点
- 本例使用 removeChild() 来删除第一个 <title> 元素的文本节点。 清空文本节点的文本
- 本例使用 nodeValue() 属性来清空第一个 <title> 元素的文本节点。 根据名称删除属性
- 本例使用 removeAttribute() 从第一个 <book> 元素中删除 "category" 属性。 根据对象删除属性
- 本例使用 removeAttributeNode() 删除 <book> 元素中的所有属性。
XML DOM 替换节点
replaceChild() 方法替换指定节点。
nodeValue 属性替换文本节点中的文本。
替换文本节点中的数据
replaceData() 方法用于替换文本节点中的数据。
replaceData() 方法有三个参数：
- offset - 在何处开始替换字符。Offset 值以 0 开始。
- length - 要替换多少字符
- string - 要插入的字符串
- 本例使用 createElement() 来创建一个新的元素节点，并使用 appendChild() 把它添加到一个节点。 通过使用 createAttribute 来创建属性节点
- 本例使用 createAttribute() 来创建新的属性节点，并使用 setAttributeNode() 把该节点插入一个元素中。 通过使用 setAttribute 来创建属性节点
- 本例使用 setAttribute() 为一个元素创建一个新的属性。 创建文本节点
- 本例使用 createTextNode() 来创建新的文本节点，并使用 appendChild() 把该文本节点添加到一个元素中。 创建一个 CDATA section 节点
- 本例用 createCDATAsection() 来创建 CDATA section 节点，并使用 appendChild() 把它添加到元素中。 创建注释节点
- 本例使用 createComment() 来创建一个 comment 节点，并使用 appendChild() 把它添加到一个元素中。
XML DOM 创建节点
创建元素节点createCDATASection() 方法创建一个新的 CDATA section 节点。
xmlDoc=loadXMLDoc("books.xml");
newCDATA=xmlDoc.createCDATASection("Special Offer & Book Sale");
x=xmlDoc.getElementsByTagName("book")[0];
x.appendChild(newCDATA);
创建注释节点
createComment() 方法创建一个新的注释节点。
xmlDoc=loadXMLDoc("books.xml");
newComment=xmlDoc.createComment("Revised March 2008");
x=xmlDoc.getElementsByTagName("book")[0];
x.appendChild(newComment);
XML DOM 添加节点
-
在最后一个子节点之后添加一个节点
- 本例使用 appendChild() 方法向一个存在的节点添加一个子节点。 在指定的子节点之前添加一个节点
- 本例使用 insertBefore() 方法在一个指定的子节点之前插入一个节点。 添加一个新属性
- 本例使用 setAttribute() 方法添加一个新的属性。 向文本节点添加数据
- 本例使用 insertData() 把数据插入一个已存在的文本节点中。
插入节点 - insertBefore()
insertBefore() 方法用于在指定的子节点之前插入节点。
在被添加的节点的位置很重要时，此方法很有用。
xmlDoc=loadXMLDoc("books.xml");
newNode=xmlDoc.createElement("book");
x=xmlDoc.documentElement;
y=xmlDoc.getElementsByTagName("book")[3];
x.insertBefore(newNode,y);
向文本节点添加文本 - insertData()
insertData() 方法将数据插入已有的文本节点中。
insertData() 方法有两个参数：
- offset - 在何处开始插入字符（以 0 开始）
- string - 要插入的字符串
下面的代码片段将把 "Easy" 添加到已加载的 XML 的第一个 <title> 元素的文本节点：
xmlDoc=loadXMLDoc("books.xml");
x=xmlDoc.getElementsByTagName("title")[0].childNodes[0];
x.insertData(0,"Hello ");
XML DOM 克隆节点
复制节点
cloneNode() 方法创建指定节点的副本。
cloneNode() 方法有一个参数（true 或 false）。该参数指示被复制的节点是否包括原节点的所有属性和子节点。
下面的代码片段拷贝第一个 <book> 节点，并把它追加到文档的根节点
XMLHttpRequest 对象
XMLHttpRequest 对象提供了在网页加载后与服务器进行通信的方法。
什么是 XMLHttpRequest 对象？
XMLHttpRequest 对象是开发者的梦想，因为您能够：
- 在不重新加载页面的情况下更新网页
- 在页面已加载后从服务器请求数据
- 在页面已加载后从服务器接收数据
- 在后台向服务器发送数据
所有现代的浏览器都支持 XMLHttpRequest 对象。
扫一扫
1453
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
