DOM XML - Ajouter un nœud

Dans ce chapitre, nous aborderons les nœuds de l'élément existant. Il fournit un moyen de -

  • ajouter de nouveaux nœuds enfants avant ou après les nœuds enfants existants

  • insérer des données dans le nœud de texte

  • ajouter un nœud d'attribut

Les méthodes suivantes peuvent être utilisées pour ajouter / ajouter les nœuds à un élément dans un DOM -

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

appendChild ()

La méthode appendChild () ajoute le nouveau nœud enfant après le nœud enfant existant.

Syntaxe

La syntaxe de la méthode appendChild () est la suivante -

Node appendChild(Node newChild) throws DOMException

Où,

  • newChild - Est le nœud à ajouter

  • Cette méthode renvoie le nœud ajouté.

Exemple

L'exemple suivant (appendchildnode_example.htm) analyse un document XML ( node.xml ) dans un objet DOM XML et ajoute le nouvel enfant PhoneNo à l'élément <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>

Dans l'exemple ci-dessus -

  • en utilisant la méthode createElement (), un nouvel élément PhoneNo est créé.

  • Le nouvel élément PhoneNo est ajouté à l'élément FirstName à l'aide de la méthode appendChild ().

Exécution

Enregistrez ce fichier sous le nom appendchildnode_example.htm sur le chemin du serveur (ce fichier et node.xml doivent être sur le même chemin sur votre serveur). Dans la sortie, nous obtenons la valeur d'attribut comme PhoneNo .

insertBefore ()

La méthode insertBefore () insère les nouveaux nœuds enfants avant les nœuds enfants spécifiés.

Syntaxe

La syntaxe de la méthode insertBefore () est la suivante -

Node insertBefore(Node newChild, Node refChild) throws DOMException

Où,

  • newChild - Est le nœud à insérer

  • refChild - Est le nœud de référence, c'est-à-dire le nœud avant lequel le nouveau nœud doit être inséré.

  • Cette méthode renvoie le nœud en cours d'insertion.

Exemple

L'exemple suivant (insertnodebefore_example.htm) analyse un document XML ( node.xml ) dans un objet DOM XML et insère un nouvel e-mail enfant avant l'élément spécifié <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>

Dans l'exemple ci-dessus -

  • en utilisant la méthode createElement (), un nouvel élément Email est créé.

  • Le nouvel élément Email est ajouté avant l'élément Email en utilisant la méthode insertBefore ().

  • y.length donne le nombre total d'éléments ajoutés avant et après le nouvel élément.

Exécution

Enregistrez ce fichier sous le nom insertnodebefore_example.htm sur le chemin du serveur (ce fichier et node.xml doivent être sur le même chemin sur votre serveur). Nous recevrons la sortie suivante -

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

insertData ()

La méthode insertData () insère une chaîne au décalage d'unité 16 bits spécifié.

Syntaxe

InsertData () a la syntaxe suivante -

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

Où,

  • offset - est le décalage de caractère auquel insérer.

  • arg - est le mot clé pour insérer les données. Il entoure les deux paramètres offset et string entre parenthèses séparés par une virgule.

Exemple

L'exemple suivant (addtext_example.htm) analyse un document XML (" node.xml ") dans un objet XML DOM et insère de nouvelles données MiddleName à la position spécifiée dans l'élément <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");- Ici, x contient le nom du nom de l'enfant spécifié, c'est-à-dire <FirstName>. Nous insérons ensuite dans ce nœud de texte les données "MiddleName" à partir de la position 6.

Exécution

Enregistrez ce fichier sous le nom addtext_example.htm sur le chemin du serveur (ce fichier et node.xml doivent être sur le même chemin sur votre serveur). Nous recevrons ce qui suit dans la sortie -

Tanmay
TanmayMiddleName