XML DOM 添加节点 · W3School Xml 教程

# XML DOM 添加节点 ## 尝试一下 - 实例下面的实例使用 XML 文件 [books.xml](images/books.xml)。函数 [loadXMLDoc()](dom-loadxmldoc.html)，位于外部 JavaScript 中，用于加载 XML 文件。 [在最后一个子节点之后添加一个节点](/try/try.php?filename=try_dom_createelement2) 本例使用 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> ``` [在指定的子节点之前添加一个节点](/try/try.php?filename=try_dom_insertbefore) 本例使用 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> ``` [添加一个新属性](/try/try.php?filename=try_dom_createattribute3) 本例使用 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> ``` [向文本节点添加数据](/try/try.php?filename=try_dom_insertdata) 本例使用 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() appendChild() 方法向一个已有的节点添加一个子节点。新节点会添加（追加）到任何已有的子节点之后。 **注意：**如果节点的位置很重要，请使用 insertBefore() 方法。下面的代码片段创建一个元素（<edition>），并把它添加到第一个 <book> 元素的最后一个子节点后面： ## 实例 ``` xmlDoc=loadXMLDoc("books.xml"); newel=xmlDoc.createElement("edition"); x=xmlDoc.getElementsByTagName("book")[0]; x.appendChild(newel); ``` 实例解释： 1. 使用 [loadXMLDoc()](dom-loadxmldoc.html) 把 "[books.xml](images/books.xml)" 载入 xmlDoc 中 2. 创建一个新节点 <edition> 3. 把这个节点追加到第一个 <book> 元素遍历并向所有 <book> 元素追加一个元素：[尝试一下](/try/try.php?filename=try_dom_createelement) ## 插入节点 - insertBefore() insertBefore()方法用于在指定的子节点之前插入节点。在被添加的节点的位置很重要时，此方法很有用： ## 实例 ``` xmlDoc=loadXMLDoc("books.xml"); newNode=xmlDoc.createElement("book"); x=xmlDoc.documentElement; y=xmlDoc.getElementsByTagName("book")[3]; x.insertBefore(newNode,y); ``` 实例解释： 1. 使用 [loadXMLDoc()](dom-loadxmldoc.html) 把 "[books.xml](images/books.xml)" 载入 xmlDoc 中 2. 创建一个新的元素节点 <book> 3. 把这个新节点插到最后一个 <book> 元素节点之前如果 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"); ``` 实例解释： 1. 使用 [loadXMLDoc()](dom-loadxmldoc.html) 把 "[books.xml](images/books.xml)" 载入 xmlDoc 中 2. 把第一个 <book> 元素的 "edition" 属性的值设置（创建）为 "first" **注意：**如果属性已存在，setAttribute() 方法将覆盖已有的值。 ## 向文本节点添加文本 - insertData() insertData() 方法将数据插入已有的文本节点中。 insertData() 方法有两个参数： * offset - 在何处开始插入字符（以 0 开始） * string - 要插入的字符串下面的代码片段将把 "Easy" 添加到已加载的 XML 的第一个 <title> 元素的文本节点： ## 实例 ``` xmlDoc=loadXMLDoc("books.xml"); x=xmlDoc.getElementsByTagName("title")[0].childNodes[0]; x.insertData(0,"Easy "); ```