当前位置: 首页 > 教程 > DOM >

XML DOM删除节点

精华
小牛编辑
101浏览
2023-03-14

在本章中,我们将学习XML DOM删除节点的操作。删除节点操作是指从文档中删除指定的节点。实现此操作以移除诸如文本节点,元素节点或属性节点之类的节点。

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

  • removeChild()方法
  • removeAttribute()方法

1. removeChild()方法

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

语法
使用removeChild()方法的语法如下 -

Node removeChild(Node oldChild) throws DOMException

其中,

  • oldChild - 是要删除的节点。
  • 此方法返回已删除的节点。

示例1 - 删除当前节点
以下示例(remove_curtnode.html)将XML文档(node.xml)解析为XML DOM对象,并从父节点中删除指定的节点<ContactNo>

<!DOCTYPE html>
<html>
   <head>
   <meta charset="utf-8">
      <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("/node.xml");

         document.write("<b>在删除操作之前,总共有ContactNo元素: </b>");
         document.write(xmlDoc.getElementsByTagName("ContactNo").length);
         document.write("<br>");

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

         document.write("<b>在删除操作之后,总共有ContactNo元素: </b>");
         document.write(xmlDoc.getElementsByTagName("ContactNo").length);
      </script>
   </body>
</html>

在上面的例子中 -

  • x = xmlDoc.getElementsByTagName("ContactNo")[0]获取索引为0的元素<ContactNo>
  • x.parentNode.removeChild(x);从父节点中删除索引为0的元素<ContactNo>

执行上面示例代码,得到以下结果 -

示例2 - 删除文本节点

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

<!DOCTYPE html>
<html>
   <head>
         <meta charset="utf-8">
      <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("/node.xml");

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

         document.write("<b>删除前子节点的文本节点数量是:</b> ");
         document.write(x.childNodes.length);
         document.write("<br>");

         y = x.childNodes[0];
         x.removeChild(y);
         document.write("<b>删除后子节点的文本节点数量是:</b> ");
         document.write(x.childNodes.length);

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

在上面的例子中 -

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

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

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

执行上面示例代码,得到以下结果 -

2. removeAttribute()方法

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

语法

使用removeAttribute()的语法如下 -

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

其中,

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

示例

以下示例(remove_elementattribute.html)将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("/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')); − 调用在第一个位置索引的category属性的值。
  • x[1].removeAttribute('category'); − 删除属性的值。

执行上面示例代码,得到以下结果 -