XML DOM appendChild() methode

Definitie en gebruik

appendChild() Deze methode voegt een knoop toe na de laatste zoonknoop van het opgegeven element.

Deze methode retourneert het nieuwe zoonknopen.

Sintaxis

appendChild(knoop)
Parameter Beschrijving
knoop Verplicht. De knoop die moet worden toegevoegd.

Voorbeeld

Voorbeeld 1

De volgende code laadt "books.xml" in xmlDoc en maakt een knoop (<edition>) die vervolgens wordt toegevoegd achter de laatste zoon van de eerste <book>-knoop:

var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = functie() {
   als (this.readyState == 4 && this.status == 200) {
       myFunction(this);
   }
};
xhttp.open("GET", "books.xml", true);
xhttp.send();
functie 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;
}

Probeer het zelf

Voorbeeld 2

De volgende code laadt "books.xml" in xmlDoc en voegt nieuwe knooppunten toe aan alle <book>-elementen:

var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = functie() {
    als (xhttp.readyState == 4 && xhttp.status == 200) {
        myFunction(xhttp);
    }
};
xhttp.open("GET", "books.xml", true);
xhttp.send();
functie myFunction(xml) {
    var x, y, z, i, newel, newtext, xmlDoc, txt;
    xmlDoc = xml.responseXML;
    txt = "";
    x = xmlDoc.getElementsByTagName("book");
    voor (i = 0; i < x.lengte; i++) {
        newel = xmlDoc.createElement("edition");
        newtext = xmlDoc.createTextNode("first");
        newel.appendChild(newtext);
        x[i].appendChild(newel);
    }
    // Output alle title en edition
    y = xmlDoc.getElementsByTagName("title");
    z = xmlDoc.getElementsByTagName("edition");
    voor (i = 0; i < y.lengte; i++) {
        txt += y[i].childNodes[0].nodeValue +
        " - Editie: " +
        z[i].childNodes[0].nodeValue + "<br>";
    }
    document.getElementById("demo").innerHTML = txt;
}

Probeer het zelf