下面的实例使用 XML 文件 books.xml。
函数 loadXMLDoc(),位于外部 JavaScript 中,用于加载 XML 文件。
在最后一个子节点之后添加一个节点
本例使用 appendChild() 方法向一个已有的节点添加一个子节点。
<!DOCTYPE html> <html> <head> <script src="loadxmldoc.js"> </script> </head> <body> <script> xmlDoc=loadXMLDoc("books.xml"); newel=xmlDoc.createElement("edition"); x=xmlDoc.getElementsByTagName("book")[0]; x.appendChild(newel); document.write(x.getElementsByTagName("edition")[0].nodeName); </script> </body> </html>
在指定的子节点之前添加一个节点
本例使用 insertBefore() 方法在一个指定的子节点之前插入一个节点。
<!DOCTYPE html> <html> <head> <script src="loadxmldoc.js"> </script> </head> <body> <script> xmlDoc=loadXMLDoc("books.xml"); newNode=xmlDoc.createElement("book"); x=xmlDoc.documentElement; y=xmlDoc.getElementsByTagName("book"); document.write("Book elements before: " + y.length); document.write("<br>"); x.insertBefore(newNode,y[3]); y=xmlDoc.getElementsByTagName("book"); document.write("Book elements after: " + y.length); </script> </body> </html>
添加一个新属性
本例使用 setAttribute() 方法添加一个新的属性。
<!DOCTYPE html> <html> <head> <script src="loadxmldoc.js"> </script> </head> <body> <script> xmlDoc=loadXMLDoc("books.xml"); x=xmlDoc.getElementsByTagName("title"); x[0].setAttribute("edition","first"); document.write("Edition: "); document.write(x[0].getAttribute("edition")); </script> </body> </html>
向文本节点添加数据
本例使用 insertData() 把数据插入一个已有的文本节点中。
<!DOCTYPE html> <html> <head> <script src="loadxmldoc.js"> </script> </head> <body> <script> xmlDoc=loadXMLDoc("books.xml"); x=xmlDoc.getElementsByTagName("title")[0].childNodes[0]; document.write(x.nodeValue); x.insertData(0,"Easy "); document.write("<br>"); document.write(x.nodeValue); </script> </body> </html>
appendChild() 方法向一个已有的节点添加一个子节点。
新节点会添加(追加)到任何已有的子节点之后。
注意:如果节点的位置很重要,请使用 insertBefore() 方法。
下面的代码片段创建一个元素(<edition>),并把它添加到第一个 <book> 元素的最后一个子节点后面:
xmlDoc=loadXMLDoc("books.xml");
newel=xmlDoc.createElement("edition");
x=xmlDoc.getElementsByTagName("book")[0];
x.appendChild(newel);
实例解释:
遍历并向所有 <book> 元素追加一个元素:尝试一下
<!DOCTYPE html> <html> <head> <script src="loadxmldoc.js"></script> </head> <body> <script> xmlDoc=loadXMLDoc("books.xml"); x=xmlDoc.getElementsByTagName("book"); for (i=0;i<x.length;i++) { newel=xmlDoc.createElement("edition"); newtext=xmlDoc.createTextNode("first"); newel.appendChild(newtext); x[i].appendChild(newel); } //Output all titles and editions y=xmlDoc.getElementsByTagName("title"); z=xmlDoc.getElementsByTagName("edition"); for (i=0;i<y.length;i++) { document.write(y[i].childNodes[0].nodeValue); document.write(" - Edition: "); document.write(z[i].childNodes[0].nodeValue); document.write("<br>"); } </script> </body> </html>
insertBefore()方法用于在指定的子节点之前插入节点。
在被添加的节点的位置很重要时,此方法很有用:
xmlDoc=loadXMLDoc("books.xml");
newNode=xmlDoc.createElement("book");
x=xmlDoc.documentElement;
y=xmlDoc.getElementsByTagName("book")[3];
x.insertBefore(newNode,y);
实例解释:
如果 insertBefore() 的第二个参数是 null,新节点将被添加到最后一个已有的子节点之后。
x.insertBefore(newNode,null) 和 x.appendChild(newNode) 都可以向 x 追加一个新的子节点。
addAtribute() 这个方法是不存在的。
如果属性不存在,则 setAttribute() 可创建一个新的属性:
xmlDoc=loadXMLDoc("books.xml");
x=xmlDoc.getElementsByTagName('book');
x[0].setAttribute("edition","first");
实例解释:
注意:如果属性已存在,setAttribute() 方法将覆盖已有的值。
insertData() 方法将数据插入已有的文本节点中。
insertData() 方法有两个参数:
下面的代码片段将把 "Easy" 添加到已加载的 XML 的第一个 <title> 元素的文本节点:
xmlDoc=loadXMLDoc("books.xml");
x=xmlDoc.getElementsByTagName("title")[0].childNodes[0];
x.insertData(0,"Easy ");