XML DOM 删除节点 · W3School Xml 教程

# XML DOM 删除节点 removeChild() 方法删除指定节点。 removeAttribute() 方法删除指定属性。 ## 尝试一下 - 实例下面的实例使用 XML 文件 [books.xml](images/books.xml)。函数 [loadXMLDoc()](dom-loadxmldoc.html)，位于外部 JavaScript 中，用于加载 XML 文件。 [删除元素节点](/try/try.php?filename=try_dom_removechild) 本例使用 removeChild() 来删除第一个 <book> 元素。 ``` <!DOCTYPE html> <html> <head> <script src="loadxmldoc.js"> </script> </head> <body> <script> xmlDoc=loadXMLDoc("books.xml"); document.write("Number of book nodes: "); document.write(xmlDoc.getElementsByTagName('book').length); document.write("<br>"); y=xmlDoc.getElementsByTagName("book")[0]; xmlDoc.documentElement.removeChild(y); document.write("Number of book nodes after removeChild(): "); document.write(xmlDoc.getElementsByTagName('book').length); </script> </body> </html> ``` [删除当前元素节点](/try/try.php?filename=try_dom_removecurrent) 本例使用 parentNode 和 removeChild() 来删除当前的 <book> 元素。 ``` <!DOCTYPE html> <html> <head> <script src="loadxmldoc.js"> </script> </head> <body> <script> xmlDoc=loadXMLDoc("books.xml"); document.write("Number of book nodes before removeChild(): "); document.write(xmlDoc.getElementsByTagName("book").length); document.write("<br>"); x=xmlDoc.getElementsByTagName("book")[0] x.parentNode.removeChild(x); document.write("Number of book nodes after removeChild(): "); document.write(xmlDoc.getElementsByTagName("book").length); </script> </body> </html> ``` [删除文本节点](/try/try.php?filename=try_dom_removetextnode) 本例使用 removeChild() 来删除第一个 <title> 元素的文本节点。 ``` <!DOCTYPE html> <html> <head> <script src="loadxmldoc.js"> </script> </head> <body> <script> xmlDoc=loadXMLDoc("books.xml"); x=xmlDoc.getElementsByTagName("title")[0]; document.write("Child nodes: "); document.write(x.childNodes.length); document.write("<br>"); y=x.childNodes[0]; x.removeChild(y); document.write("Child nodes: "); document.write(x.childNodes.length); </script> </body> </html> ``` [清空文本节点的文本](/try/try.php?filename=try_dom_remove_nodevalue) 本例使用 nodeValue() 属性来清空第一个 <title> 元素的文本节点。 ``` <!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("Value: " + x.nodeValue); document.write("<br>"); x.nodeValue=""; document.write("Value: " + x.nodeValue); </script> </body> </html> ``` [根据名称删除属性](/try/try.php?filename=try_dom_removeattribute) 本例使用 removeAttribute() 从第一个 <book> 元素中删除 "category" 属性。 ``` <!DOCTYPE html> <html> <head> <script src="loadxmldoc.js"> </script> </head> <body> <script> xmlDoc=loadXMLDoc("books.xml"); x=xmlDoc.getElementsByTagName('book'); document.write(x[0].getAttribute('category')); document.write("<br>"); x[0].removeAttribute('category'); document.write(x[0].getAttribute('category')); </script> </body> </html> ``` [根据对象删除属性](/try/try.php?filename=try_dom_removeattributenode) 本例使用 removeAttributeNode() 从所有 <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++) { while (x[i].attributes.length>0) { attnode=x[i].attributes[0]; old_att=x[i].removeAttributeNode(attnode); document.write("Removed: " + old_att.nodeName) document.write(": " + old_att.nodeValue) document.write("<br>") } } </script> </body> </html> ``` ## 删除元素节点 removeChild() 方法删除指定的节点。当一个节点被删除时，其所有子节点也会被删除。下面的代码片段将从载入的 xml 中删除第一个 <book> 元素： ## 实例 ``` xmlDoc=loadXMLDoc("books.xml"); y=xmlDoc.getElementsByTagName("book")[0]; xmlDoc.documentElement.removeChild(y); ``` 实例解释： 1. 使用 [loadXMLDoc()](dom-loadxmldoc.html) 把 "[books.xml](images/books.xml)" 载入 xmlDoc 中 2. 把变量 y 设置为要删除的元素节点 3. 通过使用 removeChild() 方法从父节点删除元素节点 ## 删除自身 - 删除当前的节点 removeChild() 方法是唯一可以删除指定节点的方法。当您已导航到需要删除的节点时，就可以通过使用 parentNode 属性和 removeChild() 方法来删除此节点： ## 实例 ``` xmlDoc=loadXMLDoc("books.xml"); x=xmlDoc.getElementsByTagName("book")[0]; x.parentNode.removeChild(x); ``` 实例解释： 1. 使用 [loadXMLDoc()](dom-loadxmldoc.html) 把 "[books.xml](images/books.xml)" 载入 xmlDoc 中 2. 把变量 y 设置为要删除的元素节点 3. 通过使用 parentNode 属性和 removeChild() 方法来删除此元素节点 ## 删除文本节点 removeChild() 方法可用于删除文本节点： ## 实例 ``` xmlDoc=loadXMLDoc("books.xml"); x=xmlDoc.getElementsByTagName("title")[0]; y=x.childNodes[0]; x.removeChild(y); ``` 实例解释： 1. 使用 [loadXMLDoc()](dom-loadxmldoc.html) 把 "[books.xml](images/books.xml)" 载入 xmlDoc 中 2. 把变量 x 设置为第一个 title 元素节点 3. 把变量 y 设置为要删除的文本节点 4. 通过使用 removeChild() 方法从父节点删除元素节点不太常用 removeChild() 从节点删除文本。可以使用 nodeValue 属性代替它。请看下一段。 ## 清空文本节点 nodeValue 属性可用于改变或清空文本节点的值： ## 实例 ``` xmlDoc=loadXMLDoc("books.xml"); x=xmlDoc.getElementsByTagName("title")[0].childNodes[0]; x.nodeValue=""; ``` 实例解释： 1. 使用 [loadXMLDoc()](dom-loadxmldoc.html) 把 "[books.xml](images/books.xml)" 载入 xmlDoc 中 2. 把变量 x 设置为第一个 title 元素的文本节点 3. 使用 nodeValue 属性来清空文本节点的文本遍历并更改所有 <title> 元素的文本节点： [尝试一下](/try/try.php?filename=try_dom_remove_nodevalue2) ## 根据名称删除属性节点 removeAttribute(_name_) 方法用于根据名称删除属性节点。实例：removeAttribute('category') 下面的代码片段删除第一个 <book> 元素中的 "category" 属性： ## 实例 ``` xmlDoc=loadXMLDoc("books.xml"); x=xmlDoc.getElementsByTagName("book"); x[0].removeAttribute("category"); ``` 实例解释： 1. 使用 [loadXMLDoc()](dom-loadxmldoc.html) 把 "[books.xml](images/books.xml)" 载入 xmlDoc 中 2. 使用 getElementsByTagName() 来获取 book 节点 3. 从第一个 book 元素节点中删除 "category" 属性遍历并删除所有 <book> 元素的 "category" 属性： [尝试一下](/try/try.php?filename=try_dom_removeattribute2) ## 根据对象删除属性节点 removeAttributeNode(_node_) 方法通过使用 node 对象作为参数，来删除属性节点。实例: removeAttributeNode(x) 下面的代码片段删除所有 <book> 元素的所有属性： ## 实例 ``` xmlDoc=loadXMLDoc("books.xml"); x=xmlDoc.getElementsByTagName("book"); for (i=0;i<x.length;i++) { while (x[i].attributes.length>0) { attnode=x[i].attributes[0]; old_att=x[i].removeAttributeNode(attnode); } } ``` 实例解释： 1. 使用 [loadXMLDoc()](dom-loadxmldoc.html) 把 "[books.xml](images/books.xml)" 载入 xmlDoc 中 2. 使用 getElementsByTagName() 来获取所有 book 节点 3. 检查每个 book 元素是否拥有属性 4. 如果在某个 book 元素中存在属性，则删除该属性