Dom Clone Nodes in XML
How to Clone Nodes in XML DOM
Cloning nodes means creating a copy of an existing node in the XML DOM. This can be useful when you want to duplicate elements or templates dynamically.
Methods to Clone Nodes
cloneNode(false)— Creates a shallow copy (copies the node but not its children).cloneNode(true)— Creates a deep copy (copies the node and all its descendants).
Example XML
<book id="101"> <title>Effective Java</title> <author>Joshua Bloch</author></book>JavaScript Example: Cloning a Node
// Assume xmlDoc is your parsed XML document// Get the <book> elementconst book = xmlDoc.getElementsByTagName("book")[0];// Create a deep clone (including child elements)const clonedBook = book.cloneNode(true);// Modify cloned node attribute to differentiateclonedBook.setAttribute("id", "102");// Append cloned node to parentxmlDoc.documentElement.appendChild(clonedBook);What Happens?
The original
<book>element is copied entirely.The clone has a new
id="102"attribute.The cloned node is appended as a sibling under
<library>or root element.
Full Example in HTML + JS
<!DOCTYPE html><html><head><title>DOM Clone Nodes in XML</title></head><body><h2>Clone XML Node</h2><button onclick="cloneBook()">Clone Book</button><pre id="xmlOutput"></pre><script>const xmlString = `<library> <book id="101"> <title>Effective Java</title> <author>Joshua Bloch</author> </book></library>`;const parser = new DOMParser();const xmlDoc = parser.parseFromString(xmlString, "text/xml");function displayXML() { const serializer = new XMLSerializer(); const xmlStr = serializer.serializeToString(xmlDoc); document.getElementById("xmlOutput").textContent = xmlStr;}function cloneBook() { const book = xmlDoc.getElementsByTagName("book")[0]; const clonedBook = book.cloneNode(true); // deep clone clonedBook.setAttribute("id", "102"); xmlDoc.documentElement.appendChild(clonedBook); displayXML();}displayXML();</script></body></html>Summary
| Method | Description |
|---|---|
cloneNode(false) | Clone node without children (shallow) |
cloneNode(true) | Clone node with all children (deep) |
Want to learn how to import nodes between XML documents or other DOM operations?
