XML DOM replaceChild() Method

Definition and Usage

replaceChild() This method replaces one child node with another child node.

The function returns the replaced node on success, and returns NULL.

Syntax

elementNode.replaceChild(new_node,old_node)

Example

The following code loads "books.xml" into xmlDoc and replaces the first <book> element:

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 x, y, z, i, newNode, newTitle, newText, xmlDoc, txt;
    xmlDoc = xml.responseXML;
    txt = "";
    x = xmlDoc.documentElement;
    // Create a book element, a title element, and a text node
    newNode = xmlDoc.createElement("book");
    newTitle = xmlDoc.createElement("title");
    newText = xmlDoc.createTextNode("Hello World");
    // Add a text node to the title node
    newTitle.appendChild(newText);
    // Add this title node to the book node
    newNode.appendChild(newTitle);
    y = xmlDoc.getElementsByTagName("book")[0];
    // Replace this new book node with the first book node
    x.replaceChild(newNode, y);
    z = xmlDoc.getElementsByTagName("title");
    // Output all titles
    for (i = 0; i < z.length; i++) {
        txt += z[i].childNodes[0].nodeValue + "<br>";
    }
    document.getElementById("demo").innerHTML = txt;
}

Try It Yourself