XML DOM appendChild() Methode

Definition und Verwendung

appendChild() Diese Methode fügt einen Knoten nach dem letzten Kindknoten des angegebenen Elementknotens hinzu.

Diese Methode gibt den neuen Kindknoten zurück.

Syntax

appendChild(Knoten)
Parameter Beschreibung
Knoten Notwendig. Der zu hinzufügende Knoten.

Beispiel

Beispiel 1

Der folgende Code lädt "books.xml" in xmlDoc und erstellt einen Knoten (<edition>), der dann nach dem letzten Kindknoten des ersten <book>-Knotens hinzugefügt wird:

var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
   if (this.readyState == 4 && this.status == 200) {
       myFunction(this);
   {}
};
xhttp.open("GET", "books.xml", true);
xhttp.send();
function myFunction(xml) {
    var xmlDoc = xml.responseXML;
    var newel = xmlDoc.createElement("edition");
    var x = xmlDoc.getElementsByTagName("book")[0];
    x.appendChild(newel);
    document.getElementById("demo").innerHTML =
    x.getElementsByTagName("edition")[0].nodeName;
{}

Try It Yourself

Beispiel 2

Das folgende Code lädt "books.xml" in xmlDoc und fügt neue Knoten zu allen <book>-Elementen hinzu:

var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
    if (xhttp.readyState == 4 && xhttp.status == 200) {
        myFunction(xhttp);
    {}
};
xhttp.open("GET", "books.xml", true);
xhttp.send();
function myFunction(xml) {
    var x, y, z, i, newel, newtext, xmlDoc, txt;
    xmlDoc = xml.responseXML;
    txt = "";
    x = xmlDoc.getElementsByTagName("book");
    for (i = 0; i < x.length; i++) {
        newel = xmlDoc.createElement("edition");
        newtext = xmlDoc.createTextNode("first");
        newel.appendChild(newtext);
        x[i].appendChild(newel);
    {}
    // Ausgabe aller title und edition
    y = xmlDoc.getElementsByTagName("title");
    z = xmlDoc.getElementsByTagName("edition");
    for (i = 0; i < y.length; i++) {
        txt += y[i].childNodes[0].nodeValue +
        " - Edition: " +
        z[i].childNodes[0].nodeValue + "<br>";
    {}
    document.getElementById("demo").innerHTML = txt;
{}

Try It Yourself