XML DOM - 创建节点



本章将讨论如何使用文档对象的几种方法来创建新节点。这些方法提供了创建新的元素节点、文本节点、注释节点、CDATA 节点和属性节点的范围。如果新创建的节点已存在于元素对象中,则会被新的节点替换。以下部分将通过示例演示这一点。

创建新的元素节点

createElement() 方法创建一个新的元素节点。如果新创建的元素节点已存在于元素对象中,则会被新的节点替换。

语法

使用createElement() 方法的语法如下:

var_name = xmldoc.createElement("tagname");

其中:

  • var_name - 是用户定义的变量名,它保存新元素的名称。

  • ("tagname") - 是要创建的新元素节点的名称。

示例

以下示例 (createnewelement_example.htm) 将 XML 文档 (node.xml) 解析为 XML DOM 对象,并在 XML 文档中创建一个新的元素节点PhoneNo

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

         new_element = xmlDoc.createElement("PhoneNo");

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

         document.write(x.getElementsByTagName("PhoneNo")[0].nodeName);
      </script>
   </body>
</html>
  • new_element = xmlDoc.createElement("PhoneNo"); 创建新的元素节点 <PhoneNo>

  • x.appendChild(new_element); x 保存指定子节点 <FirstName> 的名称,新元素节点将附加到该节点。

执行

将此文件保存为服务器路径上的createnewelement_example.htm(此文件和node.xml应位于服务器上的同一路径)。在输出中,我们将属性值作为PhoneNo

创建新的文本节点

createTextNode() 方法创建一个新的文本节点。

语法

使用createTextNode() 的语法如下:

var_name = xmldoc.createTextNode("tagname");

其中:

  • var_name - 是用户定义的变量名,它保存新文本节点的名称。

  • ("tagname") - 括号内是要创建的新文本节点的名称。

示例

以下示例 (createtextnode_example.htm) 将 XML 文档 (node.xml) 解析为 XML DOM 对象,并在 XML 文档中创建一个新的文本节点Im new text node

<!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");
         create_t = xmlDoc.createTextNode("Im new text node");
         create_e.appendChild(create_t);

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


         document.write(" PhoneNO: ");
         document.write(x.getElementsByTagName("PhoneNo")[0].childNodes[0].nodeValue);
      </script>
    </body>
</html>

上述代码的详细信息如下:

  • create_e = xmlDoc.createElement("PhoneNo"); 创建一个新的元素 <PhoneNo>。

  • create_t = xmlDoc.createTextNode("Im new text node"); 创建一个新的文本节点"Im new text node"

  • x.appendChild(create_e); 文本节点"Im new text node" 附加到元素 <PhoneNo>。

  • document.write(x.getElementsByTagName("PhoneNo")[0].childNodes[0].nodeValue); 将新文本节点的值写入元素 <PhoneNo>。

执行

将此文件保存为服务器路径上的createtextnode_example.htm(此文件和 node.xml 应位于服务器上的同一路径)。在输出中,我们将属性值作为,即PhoneNO: Im new text node

创建新的注释节点

createComment() 方法创建一个新的注释节点。注释节点包含在程序中是为了更容易理解代码的功能。

语法

使用createComment() 的语法如下:

var_name = xmldoc.createComment("tagname");

其中:

  • var_name - 是用户定义的变量名,它保存新注释节点的名称。

  • ("tagname") - 是要创建的新注释节点的名称。

示例

以下示例 (createcommentnode_example.htm) 将 XML 文档 (node.xml) 解析为 XML DOM 对象,并在 XML 文档中创建一个新的注释节点"Company is the parent node"

<!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_comment = xmlDoc.createComment("Company is the parent node");

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

         x.appendChild(create_comment);

         document.write(x.lastChild.nodeValue);
      </script>
   </body>
</html>

在上面的例子中:

  • create_comment = xmlDoc.createComment("Company is the parent node") **创建指定的注释行**。

  • x.appendChild(create_comment) 在这一行中,'x' 保存元素 <Company> 的名称,注释行将附加到该元素。

执行

将此文件保存为服务器路径上的createcommentnode_example.htm(此文件和node.xml应位于服务器上的同一路径)。在输出中,我们将属性值作为Company is the parent node

创建新的CDATA 节

createCDATASection() 方法创建一个新的 CDATA 节点。如果新创建的 CDATA 节点已存在于元素对象中,则会被新的节点替换。

语法

使用createCDATASection() 的语法如下:

var_name = xmldoc.createCDATASection("tagname");

其中:

  • var_name - 是用户定义的变量名,它保存新的 CDATA 节点的名称。

  • ("tagname") - 是要创建的新 CDATA 节点的名称。

示例

以下示例 (createcdatanode_example.htm) 将 XML 文档 (node.xml) 解析为 XML DOM 对象,并在 XML 文档中创建一个新的 CDATA 节点"Create CDATA Example"

<!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_CDATA = xmlDoc.createCDATASection("Create CDATA Example");

         x = xmlDoc.getElementsByTagName("Employee")[0];
         x.appendChild(create_CDATA);
         document.write(x.lastChild.nodeValue);
      </script>
   </body>
</html>

在上面的例子中:

  • create_CDATA = xmlDoc.createCDATASection("Create CDATA Example") 创建一个新的 CDATA 节点"Create CDATA Example"

  • x.appendChild(create_CDATA) 在这里,x 保存索引为 0 的指定元素 <Employee>,CDATA 节点值将附加到该元素。

执行

将此文件保存为服务器路径上的createcdatanode_example.htm(此文件和 node.xml 应位于服务器上的同一路径)。在输出中,我们将属性值作为Create CDATA Example

创建新的属性节点

要创建一个新的属性节点,可以使用setAttributeNode() 方法。如果新创建的属性节点已存在于元素对象中,则会被新的节点替换。

语法

使用createElement() 方法的语法如下:

var_name = xmldoc.createAttribute("tagname");

其中:

  • var_name - 是用户定义的变量名,它保存新属性节点的名称。

  • ("tagname") - 是要创建的新属性节点的名称。

示例

以下示例 (createattributenode_example.htm) 将 XML 文档 (node.xml) 解析为 XML DOM 对象,并在 XML 文档中创建一个新的属性节点section

<!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_a = xmlDoc.createAttribute("section");
         create_a.nodeValue = "A";

         x = xmlDoc.getElementsByTagName("Employee");
         x[0].setAttributeNode(create_a);
         document.write("New Attribute: ");
         document.write(x[0].getAttribute("section"));

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

在上面的例子中:

  • create_a=xmlDoc.createAttribute("Category") 创建一个名为 <section> 的属性。

  • create_a.nodeValue="Management" 为属性 <section> 创建值"A"

  • x[0].setAttributeNode(create_a) 此属性值设置为索引为 0 的节点元素 <Employee>。

广告