XML DOM-ノードの追加

この章では、既存の要素のノードについて説明します。それは手段を提供します-

既存の子ノードの前または後に新しい子ノードを追加します
テキストノード内にデータを挿入する
属性ノードを追加

以下のメソッドを使用して、DOMの要素にノードを追加/追加できます-

appendChild（）
insertBefore（）
insertData（）

appendChild（）

メソッドappendChild（）は、既存の子ノードの後に新しい子ノードを追加します。

構文

appendChild（）メソッドの構文は次のとおりです-

Node appendChild(Node newChild) throws DOMException

どこで、

newChild-追加するノードです
このメソッドは、追加された_Node_を返します。

例

次の例（appendchildnode_example）は、XMLドキュメント（link：/dom/node.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_という名前でサーバーパスに保存します（このファイルとnode.xmlはサーバーの同じパスにある必要があります）。出力では、_PhoneNo_として属性値を取得します。

insertBefore（）

メソッド_insertBefore（）_は、指定された子ノードの前に新しい子ノードを挿入します。

構文

insertBefore（）メソッドの構文は次のとおりです-

Node insertBefore(Node newChild, Node refChild) throws DOMException

どこで、

newChild-挿入するノードです
refChild-参照ノード、つまり、新しいノードを挿入する前のノードです。
このメソッドは、挿入されている_Node_を返します。

例

次の例（insertnodebefore_example）は、XMLドキュメント（link：/dom/node.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_としてサーバーパスに保存します（このファイルとnode.xmlはサーバーの同じパスにある必要があります）。私たちは次の出力を受け取ります-

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

insertData（）

メソッドinsertData（）は、指定された16ビット単位のオフセットに文字列を挿入します。

構文

insertData（）の構文は次のとおりです-

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

どこで、

offset-は挿入する文字オフセットです。
arg-は、データを挿入するキーワードです。コンマで区切られた括弧内の2つのパラメーターオフセットと文字列を囲みます。

例

次の例（addtext_example）は、XMLドキュメント（ "link：/dom/node.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、 "MiddleName"）; _ -ここで、_x_は指定された子名の名前、つまり<FirstName>を保持します。次に、位置6から始まるデータ "MiddleName" _をこのテキストノードに挿入します。

実行

このファイルを_addtext_example_としてサーバーパスに保存します（このファイルとnode.xmlはサーバーの同じパスにある必要があります）。私たちは出力で次を受け取ります-

Tanmay
TanmayMiddleName

Dom-xml-dom-add-node

XML DOM-ノードの追加

appendChild（）

構文

例

実行

insertBefore（）

構文

例

実行

insertData（）

構文

例

実行

目次