DOM ajouter un nœud
XML DOM Ajouter un nœud
Essayer - ExempleL'exemple ci-dessous utilise le fichier XML books.xml.
La fonction loadXMLDoc(), située en JavaScript externe, permet de charger des fichiers XML.
Ajouter un nœud après le dernier nœud enfant
Cet exemple utilise la méthode appendChild() pour ajouter un nœud enfant à un nœud existant.
Ajouter un nœud avant le nœud enfant spécifié
Cet exemple utilise la méthode insertBefore() pour insérer un nœud avant un nœud enfant spécifié.
Ajouter un nouvel attribut
Cet exemple utilise la méthode setAttribute() pour ajouter un nouvel attribut.
Ajouter des données au nœud de texte
Cet exemple utilise insertData() pour insérer des données dans un nœud de texte existant.
Ajouter un nœud - appendChild()
La méthode appendChild() ajoute un nœud enfant à un nœud existant.
De nouveaux nœuds sont ajoutés (ajoutés) après tous les nœuds enfants existants.
Remarque : Si la position du nœud est importante, utilisez la méthode insertBefore().
L'extrait de code suivant crée un élément (<edition>) et l'ajoute après le dernier nœud enfant du premier élément <book> :
Exemple
<!DOCTYPE html>
<html>
<head>
<script src="loadxmldoc.js">
</script>
</head>
<body>
<script>
xmlDoc=loadXMLDoc("books.xml");
newel=xmlDoc.createElement("edition");
x=xmlDoc.getElementsByTagName("book")[0];
x.appendChild(newel);
document.write(x.getElementsByTagName("edition")[0].nodeName);
</script>
</body>
</html>Exécuter l'instance»
Cliquez sur le bouton "Exécuter l'instance" pour afficher l'instance en ligne
Explication de l'instance :
Utilisez loadXMLDoc() pour charger "books.xml" dans xmlDoc
Créez un nouveau nœud<edition>
Ajouter ce nœud au premier élément <book>
Parcourez et ajoutez un élément à tous les éléments <book> : essayez-le
Insérer un nœud - La méthode insertBefore()
insertBefore() est utilisée pour insérer un nœud avant le nœud enfant spécifié.
Cette méthode est utile lorsque la position du nœud ajouté est importante :
Instance
<!DOCTYPE html>
<html>
<head>
<script src="loadxmldoc.js">
</script>
</head>
<body>
<script>
xmlDoc=loadXMLDoc("books.xml");
newNode=xmlDoc.createElement("book");
x=xmlDoc.documentElement;
y=xmlDoc.getElementsByTagName("book");
document.write("Book elements before: " + y.length);
document.write("<br>");
x.insertBefore(newNode,y[3]);
y=xmlDoc.getElementsByTagName("book");
document.write("Book elements after: " + y.length);
</script>
</body>
</html>Exécuter l'instance »
Cliquez sur le bouton « Exécuter l'instance » pour afficher l'instance en ligne
Explication des exemples :
Utilisez loadXMLDoc() pour charger "books.xml" dans xmlDoc
Créez un nouveau nœud d'élément < ;book>
Insérer ce nouveau nœud avant le dernier nœud d'élément <book>
Si le deuxième de insertBefore() Si le premier Le paramètre est nul, le nouveau nœud sera ajouté après le dernier nœud enfant existant.
x.insertBefore(newNode,null) et x.appendChild(newNode) peuvent tous deux ajouter un nouveau nœud enfant à x.
Ajouter un nouvel attribut
addAtribute() Cette méthode n'existe pas.
Si l'attribut n'existe pas, setAttribute() peut créer un nouvel attribut :
Instance
<!DOCTYPE html>
<html>
<head>
<script src="loadxmldoc.js">
</script>
</head>
<body>
<script>
xmlDoc=loadXMLDoc("books.xml");
x=xmlDoc.getElementsByTagName("title");
x[0].setAttribute("edition","first");
document.write("Edition: ");
document.write(x[0].getAttribute("edition"));
</script>
</body>
</html>Exécuter le instance »
Cliquez sur le bouton « Exécuter l'exemple » pour voir l'exemple en ligne
Explication de l'exemple :
Utiliser loadXMLDoc() pour charger "books.xml" Chargez xmlDoc
et définissez (créez) la valeur de l'attribut "edition" du premier élément <book> 🎜>
Si l'attribut existe déjà, la méthode setAttribute() écrasera la valeur existante.
Ajouter du texte à un nœud de texte - insertData()La méthode insertData() insère des données dans un nœud de texte existant. La méthode
insertData() a deux paramètres :
- offset - où commencer à insérer des caractères (en commençant par 0)
- string - La chaîne à insérer
- L'extrait de code suivant ajoutera "Easy" au nœud de texte du premier élément <title> >
<!DOCTYPE html>
<html>
<head>
<script src="loadxmldoc.js">
</script>
</head>
<body>
<script>
xmlDoc=loadXMLDoc("books.xml");
x=xmlDoc.getElementsByTagName("title")[0].childNodes[0];
document.write(x.nodeValue);
x.insertData(0,"Easy ");
document.write("<br>");
document.write(x.nodeValue);
</script>
</body>
</html>
