DOM create node
XML DOM Create Node
Try it - Example
The following example uses the XML file books.xml.
Function loadXMLDoc(), located in external JavaScript, is used to load XML files.
Create element node
This example uses createElement() to create a new element node, and uses appendChild() to add it to a node.
Use createAttribute to create an attribute node
This example uses createAttribute() to create a new attribute node, and use setAttributeNode() to insert it into an element.
Use setAttribute to create an attribute node
This example uses setAttribute() to create a new attribute for an element.
Create text node
This example uses createTextNode() to create a new text node and appendChild() to add it to an element.
Create CDATA section node
This example uses createCDATAsection() to create a CDATA section node, and uses appendChild() to add it to an element.
Create a comment node
This example uses createComment() to create a comment node, and uses appendChild() to add it to an element.
Create a new element node
createElement() method creates a new element node:
Instance
<!DOCTYPE html>
<html>
<head>
<script src="loadxmldoc.js">
</script>
</head>
<body>
<script>
xmlDoc=loadXMLDoc("books.xml");
newel=xmlDoc.createElement("edition");
x=xmlDoc.getElementsByTagName("book")[0];
x.appendChild(newel);
document.write(x.getElementsByTagName("edition")[0].nodeName);
</script>
</body>
</html>Run instance»
Click the "Run instance" button to view the online instance
Explanation of the instance:
Use loadXMLDoc() loads "books.xml" into xmlDoc
Create a new element node<edition>
To the first <book> elements append this element node
Traverse and add an element to all <book> elements: try it
Create New attribute node
createAttribute() is used to create a new attribute node:
Instance
<!DOCTYPE html>
<html>
<head>
<script src="loadxmldoc.js">
</script>
</head>
<body>
<script>
xmlDoc=loadXMLDoc("books.xml");
newatt=xmlDoc.createAttribute("edition");
newatt.nodeValue="first";
x=xmlDoc.getElementsByTagName("title");
x[0].setAttributeNode(newatt);
document.write("Edition: ");
document.write(x[0].getAttribute("edition"));
</script>
</body>
</html>Running instance »
Click the "Run Instance" button to view the online instance
Explanation of examples:
Use loadXMLDoc() to load "books.xml" into xmlDoc
Create a new attribute node "edition"
Set the value of the attribute node to "first"
Add this new attribute to the first <title> element Node
Traverse all <title> elements and add a new attribute node: try it
Note:If the attribute is already If it exists, it will be replaced by the new attribute.
Use setAttribute() to create attributes
Since the setAttribute() method can create a new attribute if the attribute does not exist, we can use this method to create a new attribute .
Instance
<!DOCTYPE html>
<html>
<head>
<script src="loadxmldoc.js">
</script>
</head>
<body>
<script>
xmlDoc=loadXMLDoc("books.xml");
x=xmlDoc.getElementsByTagName("title");
x[0].setAttribute("edition","first");
document.write("Edition: ");
document.write(x[0].getAttribute("edition"));
</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
is the first < The book> element sets (creates) the "edition" attribute with the value "first"
Loop through all the <title> elements and add a new attribute: try it
Create text node
createTextNode() method creates a new text node:
Instance
<!DOCTYPE html>
<html>
<head>
<script src="loadxmldoc.js">
</script>
</head>
<body>
<script>
xmlDoc=loadXMLDoc("books.xml");
newel=xmlDoc.createElement("edition");
newtext=xmlDoc.createTextNode("first");
newel.appendChild(newtext);
x=xmlDoc.getElementsByTagName("book")[0];
x.appendChild(newel);
//Output title and edition
document.write(x.getElementsByTagName("title")[0].childNodes[0].nodeValue);
document.write(" - Edition: ");
document.write(x.getElementsByTagName("edition")[0].childNodes[0].nodeValue);
</script>
</body>
</html>Run Example»
Click the "Run Example" button to view the online example
Explanation of the example:
Use loadXMLDoc() to load "books. xml" Load xmlDoc
Create a new element node<edition>
Create a new text node whose text is" first"
Append a new text node to this element node
Append a new element node to the first <book> element
Add an element node with a text node to all <book> elements: try it
Create a CDATA Section node
The createCDATASection() method creates a new CDATA section node.
Instance
<!DOCTYPE html>
<html>
<head>
<script src="loadxmldoc.js"></script>
</head>
<body>
<script>
xmlDoc=loadXMLDoc("books.xml");
newCDATA=xmlDoc.createCDATASection("Special Offer & Book Sale");
x=xmlDoc.getElementsByTagName("book")[0];
x.appendChild(newCDATA);
document.write(x.lastChild.nodeValue);
</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
Create a new CDATA section Node
Append this new CDATA section to the first <book> element Node
Traverse and append to all <book> elements Add a CDATA section: Try it
Create a comment node
The createComment() method creates a new comment node.
Instance
<!DOCTYPE html>
<html>
<head>
<script src="loadxmldoc.js"></script>
</head>
<body>
<script>
xmlDoc=loadXMLDoc("books.xml");
newComment=xmlDoc.createComment("Revised April 2008");
x=xmlDoc.getElementsByTagName("book")[0];
x.appendChild(newComment);
document.write(x.lastChild.nodeValue);
</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
Create a new comment node
Append this new comment node to the first <book> element
Loop and append to all <book> elements A comment node: Try it
