FREE Web Template Download
HTML CSS JAVASCRIPT SQL PHP BOOTSTRAP JQUERY ANGULARJS TUTORIALS REFERENCES EXAMPLES Blog
 

XML DOM replaceChild() Method


Element Object Reference Element Object

Example

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

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, newNode, newTitle, newText, xmlDoc, txt;
    xmlDoc = xml.responseXML;
    txt = "";
    x = xmlDoc.documentElement;

    // Create a book element, title element and a text node
    newNode = xmlDoc.createElement("book");
    newTitle = xmlDoc.createElement("title");
    newText = xmlDoc.createTextNode("A Notebook");

    // Add a text node to the title node
    newTitle.appendChild(newText);

    // Add the title node to the book node
    newNode.appendChild(newTitle);

    y = xmlDoc.getElementsByTagName("book")[0];

    // Replace the first book node with the new 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;
}

The output of the code above will be:

A Notebook
Harry Potter
XQuery Kick Start
Learning XML
Try it Yourself »

Definition and Usage

The replaceChild() method replaces a child node with another.

This function returns the replaced node on success, or NULL on failure.

Syntax

elementNode.replaceChild(new_node,old_node)
Parameter Description
new_node Required. Specifies the new node
old_node Required. Specifies the child node to replace

Element Object Reference Element Object