XML DOM - 删除节点



在本章中,我们将学习 XML DOM 的 删除节点 操作。删除节点操作会从文档中删除指定的节点。此操作可以用来删除文本节点、元素节点或属性节点。

以下是用于删除节点操作的方法:

  • removeChild()

  • removeAttribute()

removeChild()

removeChild() 方法从子节点列表中删除由 oldChild 指示的子节点,并返回该节点。删除子节点等同于删除与之关联的文本节点。因此,删除子节点会删除与之关联的文本节点。

语法

使用 removeChild() 的语法如下:

Node removeChild(Node oldChild) throws DOMException

其中:

  • oldChild - 要删除的节点。

  • 此方法返回删除的节点。

示例 - 删除当前节点

以下示例 (removecurrentnode_example.htm) 将 XML 文档 (node.xml) 解析为 XML DOM 对象,并从父节点中删除指定的节点 <ContactNo>。

<!DOCTYPE html>
<html>
   <head>
      <script>
         function loadXMLDoc(filename) {
            if (window.XMLHttpRequest) {
               xhttp = new XMLHttpRequest();
            } else // code for IE5 and IE6 {
               xhttp = new ActiveXObject("Microsoft.XMLHTTP");
            }
            xhttp.open("GET",filename,false);
            xhttp.send();
            return xhttp.responseXML;
         }
      </script>
   </head>
   <body>
      <script>
         xmlDoc = loadXMLDoc("/dom/node.xml");

         document.write("<b>Before remove operation, total ContactNo elements: </b>");
         document.write(xmlDoc.getElementsByTagName("ContactNo").length);
         document.write("<br>");

         x = xmlDoc.getElementsByTagName("ContactNo")[0];
         x.parentNode.removeChild(x);

         document.write("<b>After remove operation, total ContactNo elements: </b>");
         document.write(xmlDoc.getElementsByTagName("ContactNo").length);
      </script>
   </body>
</html>

在上述示例中:

  • x = xmlDoc.getElementsByTagName("ContactNo")[0] 获取索引为 0 的元素 <ContactNo>。

  • x.parentNode.removeChild(x); 从父节点中删除索引为 0 的元素 <ContactNo>。

执行

将此文件保存为服务器路径上的 removecurrentnode_example.htm(此文件和 node.xml 应位于服务器上的同一路径)。我们将得到以下结果:

Before remove operation, total ContactNo elements: 3
After remove operation, total ContactNo elements: 2 

示例 - 删除文本节点

以下示例 (removetextNode_example.htm) 将 XML 文档 (node.xml) 解析为 XML DOM 对象,并删除指定的子节点 <FirstName>。

<!DOCTYPE html>
<html>
   <head>
      <script>
         function loadXMLDoc(filename) {
            if (window.XMLHttpRequest) {
               xhttp = new XMLHttpRequest();
            } else // code for IE5 and IE6 {
                xhttp = new ActiveXObject("Microsoft.XMLHTTP");
            }
            xhttp.open("GET",filename,false);
            xhttp.send();
            return xhttp.responseXML;
         }
      </script>
   </head>
   <body>
      <script>
         xmlDoc = loadXMLDoc("/dom/node.xml");

         x = xmlDoc.getElementsByTagName("FirstName")[0];

         document.write("<b>Text node of child node before removal is:</b> ");
         document.write(x.childNodes.length);
         document.write("<br>");

         y = x.childNodes[0];
         x.removeChild(y);
         document.write("<b>Text node of child node after removal is:</b> ");
         document.write(x.childNodes.length);

      </script>
   </body>
</html>

在上述示例中:

  • x = xmlDoc.getElementsByTagName("FirstName")[0]; - 将索引为 0 的第一个元素 <FirstName> 获取到 x

  • y = x.childNodes[0]; - 在这一行中,y 保存要删除的子节点。

  • x.removeChild(y); - 删除指定的子节点。

执行

将此文件保存为服务器路径上的 removetextNode_example.htm(此文件和 node.xml 应位于服务器上的同一路径)。我们将得到以下结果:

Text node of child node before removal is: 1
Text node of child node after removal is: 0 

removeAttribute()

removeAttribute() 方法按名称删除元素的属性。

语法

使用 removeAttribute() 的语法如下:

void removeAttribute(java.lang.String name) throws DOMException

其中:

  • name - 要删除的属性的名称。

示例

以下示例 (removeelementattribute_example.htm) 将 XML 文档 (node.xml) 解析为 XML DOM 对象,并删除指定的属性节点。

<!DOCTYPE html>
<html>
   <head>
      <script>
         function loadXMLDoc(filename) {
            if (window.XMLHttpRequest) {
               xhttp = new XMLHttpRequest();
            } else // code for IE5 and IE6 {
                xhttp = new ActiveXObject("Microsoft.XMLHTTP");
            }
            xhttp.open("GET",filename,false);
            xhttp.send();
            return xhttp.responseXML;
         }
      </script>
   </head>
   <body>

      <script>
         xmlDoc = loadXMLDoc("/dom/node.xml");

         x = xmlDoc.getElementsByTagName('Employee');

         document.write(x[1].getAttribute('category'));
         document.write("<br>");

         x[1].removeAttribute('category');

         document.write(x[1].getAttribute('category'));

      </script>
   </body>
</html>

在上述示例中:

  • document.write(x[1].getAttribute('category')); - 调用索引为 1 的属性 category 的值。

  • x[1].removeAttribute('category'); - 删除属性值。

执行

将此文件保存为服务器路径上的 removeelementattribute_example.htm(此文件和 node.xml 应位于服务器上的同一路径)。我们将得到以下结果:

Non-Technical
null
广告