XML DOM - Remove Nodes

The removeChild() method removes a specified node.The removeAttribute() method removes a specified attribute

Remove an Element Node

The removeChild() method removes a specified node.

When a node is removed, all its child nodes are also removed.

This code will remove the first <book> element from the loaded xml:

Example

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

xmlDoc.documentElement.removeChild(y);

Example explained:

  • Suppose books.xml is loaded into xmlDoc
  • Set the variable y to be the element node to remove
  • Remove the element node by using the removeChild() method from the parent node
  • Remove Myself - Remove the Current Node

    The removeChild() method is the only way to remove a specified node.

    When you have navigated to the node you want to remove, it is possible to remove that node using the parentNode property and the removeChild() method:

    Example

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

    x.parentNode.removeChild(x);

    Example explained:

  • Suppose books.xml is loaded into xmlDoc
  • Set the variable y to be the element node to remove
  • Remove the element node by using the parentNode property and the removeChild() method
  • Remove a Text Node

    The removeChild() method can also be used to remove a text node:

    Example

    x = xmlDoc.getElementsByTagName("title")[0];
    y = x.childNodes[0];
    x.removeChild(y);

    Example explained:

  • Suppose books.xml is loaded into xmlDoc
  • Set the variable x to be the first title element node
  • Set the variable y to be the text node to remove
  • Remove the element node by using the removeChild() method from the parent node
  • It is not very common to use removeChild() just to remove the text from a node. The nodeValue property can be used instead. See next paragraph.

    Clear a Text Node

    The nodeValue property can be used to change the value of a text node:

    Example

    xmlDoc.getElementsByTagName("title")[0].childNodes[0].nodeValue = "";

    Example explained:

  • Suppose books.xml is loaded into xmlDoc
  • Get the first title element's first child node.
  • Use the nodeValue property to clear the text from the text node
  • Remove an Attribute Node by Name

    The removeAttribute() method removes an attribute node by its name.

    Example: removeAttribute('category')

    This code removes the "category" attribute in the first <book> element:

    Example

    x = xmlDoc.getElementsByTagName("book");
    x[0].removeAttribute("category");

    Example explained:

  • Suppose books.xml is loaded into xmlDoc
  • Use getElementsByTagName() to get book nodes
  • Remove the "category" attribute form the first book element node
  • Loop through and remove the "category" attribute of all <book> elements: Try it yourself

    Remove Attribute Nodes by Object

    The removeAttributeNode() method removes an attribute node, using the node object as parameter.

    Example: removeAttributeNode(x)

    This code removes all the attributes of all <book> elements:

    Example

    x = xmlDoc.getElementsByTagName("book");

    for (i = 0; i < x.length; i++) {
        while (x[i].attributes.length > 0) {
            attnode = x[i].attributes[0];
            old_att = x[i].removeAttributeNode(attnode);
        }
    }

    Example explained:

  • Suppose books.xml is loaded into xmlDoc
  • Use getElementsByTagName() to get all book nodes
  • For each book element check if there are any attributes
  • While there are attributes in a book element, remove the attribute