XML DOM - 添加节点

在本章中，我们将讨论现有元素的节点。它提供了一种方法 -

在现有子节点之前或之后追加新的子节点
在文本节点中插入数据
添加属性节点

以下方法可用于将节点添加/附加到 DOM 中的元素 -

追加子对象()
在()之前插入
插入数据()

追加子对象()

方法appendChild()在现有子节点之后添加新的子节点。

句法

appendChild() 方法的语法如下 -

Node appendChild(Node newChild) throws DOMException

在哪里，

newChild - 是要添加的节点
该方法返回添加的Node。

例子

以下示例 (appendchildnode_example.htm) 将 XML 文档 ( node.xml ) 解析为 XML DOM 对象，并将新的子PhoneNo附加到元素 <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");

         create_e = xmlDoc.createElement("PhoneNo");

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

         document.write(x.getElementsByTagName("PhoneNo")[0].nodeName);
      </script>
   </body>
</html>

在上面的例子中 -

使用方法createElement()，创建一个新元素PhoneNo 。
使用方法appendChild()将新元素PhoneNo添加到元素FirstName 。

执行

将此文件保存为服务器路径上的appendchildnode_example.htm （此文件和node.xml 应位于服务器中的同一路径上）。在输出中，我们得到的属性值为PhoneNo。

在()之前插入

insertBefore()方法将新的子节点插入到指定的子节点之前。

句法

insertBefore() 方法的语法如下 -

Node insertBefore(Node newChild, Node refChild) throws DOMException

在哪里，

newChild - 是要插入的节点
refChild - 是参考节点，即必须在其之前插入新节点的节点。
该方法返回正在插入的节点。

例子

以下示例 (insertnodebefore_example.htm) 将 XML 文档 ( node.xml ) 解析为 XML DOM 对象，并在指定元素 <Email> 之前插入新的子Email 。

<!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");

         create_e = xmlDoc.createElement("Email");

         x = xmlDoc.documentElement;
         y = xmlDoc.getElementsByTagName("Email");

         document.write("No of Email elements before inserting was: " + y.length);
         document.write("<br>");
         x.insertBefore(create_e,y[3]);

         y=xmlDoc.getElementsByTagName("Email");
         document.write("No of Email elements after inserting is: " + y.length);
      </script>
   </body>
</html>

在上面的例子中 -

使用方法createElement()，创建一个新元素Email 。
使用 insertBefore() 方法将新元素Email添加到元素Email之前。
y.length给出新元素之前和之后添加的元素总数。

执行

将此文件保存为服务器路径上的insertnodebefore_example.htm （此文件和 node.xml 应位于服务器中的同一路径上）。我们将收到以下输出 -

No of Email elements before inserting was: 3
No of Email elements after inserting is: 4

插入数据()

insertData() 方法在指定的 16 位单位偏移处插入字符串。

句法

insertData() 具有以下语法 -

void insertData(int offset, java.lang.String arg) throws DOMException

在哪里，

offset - 是要插入的字符偏移量。
arg - 是插入数据的关键字。它将两个参数 offset 和 string 括在括号内，并用逗号分隔。

例子

以下示例 (addtext_example.htm) 将 XML 文档 (“ node.xml ”) 解析为 XML DOM 对象，并将新数据MiddleName在指定位置插入元素 <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].childNodes[0];
        document.write(x.nodeValue);
        x.insertData(6,"MiddleName");
        document.write("<br>");
        document.write(x.nodeValue);

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

x.insertData(6,"中间名"); − 此处， x保存指定子名称的名称，即<FirstName>。然后，我们从位置 6 开始向该文本节点插入数据“MiddleName” 。

执行

将此文件保存为服务器路径上的addtext_example.htm （此文件和 node.xml 应位于服务器中的同一路径上）。我们将在输出中收到以下内容 -

Tanmay
TanmayMiddleName