DOM XML - Adicionar Nó

Neste capítulo, discutiremos os nós do elemento existente. Ele fornece um meio para -

  • anexar novos nós filhos antes ou depois dos nós filhos existentes

  • insira dados dentro do nó de texto

  • adicionar nó de atributo

Os seguintes métodos podem ser usados ​​para adicionar / anexar os nós a um elemento em um DOM -

  • appendChild()
  • insertBefore()
  • insertData()

appendChild ()

O método appendChild () adiciona o novo nó filho após o nó filho existente.

Sintaxe

A sintaxe do método appendChild () é a seguinte -

Node appendChild(Node newChild) throws DOMException

Onde,

  • newChild - é o nó a ser adicionado

  • Este método retorna o adicionado.

Exemplo

O exemplo a seguir (appendchildnode_example.htm) analisa um documento XML ( node.xml ) em um objeto XML DOM e anexa o novo filho PhoneNo ao elemento <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>

No exemplo acima -

  • usando o método createElement (), um novo elemento PhoneNo é criado.

  • O novo elemento PhoneNo é adicionado ao elemento FirstName usando o método appendChild ().

Execução

Salve este arquivo como appendchildnode_example.htm no caminho do servidor (este arquivo e node.xml devem estar no mesmo caminho em seu servidor). Na saída, obtemos o valor do atributo como PhoneNo .

insertBefore ()

O método insertBefore () insere os novos nós filhos antes dos nós filhos especificados.

Sintaxe

A sintaxe do método insertBefore () é a seguinte -

Node insertBefore(Node newChild, Node refChild) throws DOMException

Onde,

  • newChild - é o nó a ser inserido

  • refChild - É o nó de referência, ou seja, o nó antes do qual o novo nó deve ser inserido.

  • Este método retorna o Nó que está sendo inserido.

Exemplo

O exemplo a seguir (insertnodebefore_example.htm) analisa um documento XML ( node.xml ) em um objeto XML DOM e insere um novo Email filho antes do elemento especificado <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>

No exemplo acima -

  • usando o método createElement (), um novo elemento Email é criado.

  • O novo elemento Email é adicionado antes do elemento Email usando o método insertBefore ().

  • y.length fornece o número total de elementos adicionados antes e depois do novo elemento.

Execução

Salve este arquivo como insertnodebefore_example.htm no caminho do servidor (este arquivo e node.xml devem estar no mesmo caminho em seu servidor). Receberemos a seguinte saída -

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

insertData ()

O método insertData () insere uma string no deslocamento da unidade de 16 bits especificada.

Sintaxe

O insertData () tem a seguinte sintaxe -

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

Onde,

  • deslocamento - é o deslocamento de caractere no qual inserir.

  • arg - é a palavra-chave para inserir os dados. Ele inclui os dois parâmetros offset e string entre parênteses separados por vírgula.

Exemplo

O exemplo a seguir (addtext_example.htm) analisa um documento XML (" node.xml ") em um objeto XML DOM e insere novos dados MiddleName na posição especificada para o elemento <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");- Aqui, x contém o nome do filho especificado, ou seja, <FirstName>. Em seguida, inserimos neste nó de texto os dados "MiddleName" a partir da posição 6.

Execução

Salve este arquivo como addtext_example.htm no caminho do servidor (este arquivo e node.xml devem estar no mesmo caminho em seu servidor). Receberemos o seguinte na saída -

Tanmay
TanmayMiddleName