DOM delete node
XML DOM Delete node
removeChild() method deletes the specified node.
removeAttribute() method deletes the specified attribute.
Try it - Example
The example below uses the XML file books.xml.
Function loadXMLDoc(), located in external JavaScript, is used to load XML files.
Delete element node
This example uses removeChild() to delete the first <book> element.
Delete the current element node
This example uses parentNode and removeChild() to delete the current <book> element.
Delete text node
This example uses removeChild() to delete the text node of the first <title> element.
Clear the text of the text node
This example uses the nodeValue() attribute to clear the text node of the first <title> element.
Remove attributes by name
This example uses removeAttribute() to remove the "category" attribute from the first <book> element.
Remove attributes based on objects
This example uses removeAttributeNode() to remove all attributes from all <book> elements.
Delete element node
removeChild() method deletes the specified node.
When a node is deleted, all its child nodes will also be deleted.
The following code snippet will remove the first <book> element from the loaded xml:
Example
<!DOCTYPE html>
<html>
<head>
<script src="loadxmldoc.js">
</script>
</head>
<body>
<script>
xmlDoc=loadXMLDoc("books.xml");
document.write("Number of book nodes: ");
document.write(xmlDoc.getElementsByTagName('book').length);
document.write("<br>");
y=xmlDoc.getElementsByTagName("book")[0];
xmlDoc.documentElement.removeChild(y);
document.write("Number of book nodes after removeChild(): ");
document.write(xmlDoc.getElementsByTagName('book').length);
</script>
</body>
</html>Run Example»
Click the "Run Example" button to view the online example
Explanation of the example:
Use loadXMLDoc() to "books.xml" is loaded into xmlDoc
Set the variable y to the element node to be deleted
By using the removeChild() method from Parent node deletes element node
#Deletes itself - deletes the current node
removeChild() method is the only method that can delete the specified node.
When you have navigated to the node that needs to be deleted, you can delete this node by using the parentNode attribute and the removeChild() method:
Example
<!DOCTYPE html>
<html>
<head>
<script src="loadxmldoc.js">
</script>
</head>
<body>
<script>
xmlDoc=loadXMLDoc("books.xml");
document.write("Number of book nodes before removeChild(): ");
document.write(xmlDoc.getElementsByTagName("book").length);
document.write("<br>");
x=xmlDoc.getElementsByTagName("book")[0]
x.parentNode.removeChild(x);
document.write("Number of book nodes after removeChild(): ");
document.write(xmlDoc.getElementsByTagName("book").length);
</script>
</body>
</html> Run Instance»
Click the "Run Instance" button to view the online instance
Explanation of examples:
Use loadXMLDoc() to load "books.xml" into xmlDoc
Set the variable y to the desired value Deleted element node
Delete this element node by using the parentNode attribute and removeChild() method
Delete text node
removeChild() method can be used to delete text nodes:
Instance
<!DOCTYPE html>
<html>
<head>
<script src="loadxmldoc.js">
</script>
</head>
<body>
<script>
xmlDoc=loadXMLDoc("books.xml");
x=xmlDoc.getElementsByTagName("title")[0];
document.write("Child nodes: ");
document.write(x.childNodes.length);
document.write("<br>");
y=x.childNodes[0];
x.removeChild(y);
document.write("Child nodes: ");
document.write(x.childNodes.length);
</script>
</body>
</html>Run instance»
Click "Run Example" button to view online examples
Instance explanation:
Use loadXMLDoc() to load "books.xml" into xmlDoc
Set the variable x to the first title element node
Set the variable y to the text node to be deleted
-
Remove an element node from its parent node by using the removeChild() method
Less commonly used removeChild() removes text from a node. The nodeValue attribute can be used instead. Please see the next paragraph.
Clear the text node
The nodeValue property can be used to change or clear the value of the text node:
Example
<!DOCTYPE html>
<html>
<head>
<script src="loadxmldoc.js">
</script>
</head>
<body>
<script>
xmlDoc=loadXMLDoc("books.xml");
x=xmlDoc.getElementsByTagName("title")[0].childNodes[0];
document.write("Value: " + x.nodeValue);
document.write("<br>");
x.nodeValue="";
document.write("Value: " + x.nodeValue);
</script>
</body>
</html>Run Example»
Click the "Run Example" button to view the online example
Explanation of the example:
Use loadXMLDoc () Load "books.xml" into xmlDoc
Set the variable x to the text node of the first title element
Use nodeValue attribute to clear the text of the text node
Traverse and change the text nodes of all <title> elements: try it
Delete based on name Attribute node
removeAttribute(name) method is used to delete attribute nodes based on name.
Example: removeAttribute('category')
The following code snippet deletes the "category" attribute in the first <book> element:
Example
<!DOCTYPE html>
<html>
<head>
<script src="loadxmldoc.js">
</script>
</head>
<body>
<script>
xmlDoc=loadXMLDoc("books.xml");
x=xmlDoc.getElementsByTagName('book');
document.write(x[0].getAttribute('category'));
document.write("<br>");
x[0].removeAttribute('category');
document.write(x[0].getAttribute('category'));
</script>
</body>
</html>Run Instance»
Click the "Run Instance" button to view the online instance
Explanation of examples:
Use loadXMLDoc() to load "books.xml" into xmlDoc
Use getElementsByTagName() to obtain book node
Delete the "category" attribute from the first book element node
Traverse and delete the " of all <book> elements category" attribute: Try it
Delete attribute nodes based on objects
removeAttributeNode(node) method deletes attribute nodes by using the node object as a parameter.
Example: removeAttributeNode(x)
The following code snippet removes all attributes of all <book> elements:
Example
<!DOCTYPE html>
<html>
<head>
<script src="loadxmldoc.js">
</script>
</head>
<body>
<script>
xmlDoc=loadXMLDoc("books.xml");
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);
document.write("Removed: " + old_att.nodeName)
document.write(": " + old_att.nodeValue)
document.write("<br>")
}
}
</script>
</body>
</html> Run instance»
Click the "Run instance" button to view the online instance
Explanation of the instance:
Use loadXMLDoc() to load "books.xml" into xmlDoc
Use getElementsByTagName() to get all book nodes
Check each Whether a book element has attributes
If an attribute exists in a book element, delete the attribute
