XML DOM – Create Nodes | Rookie Tutorial

Try it yourself - Examples

The examples below use the XML file books.xml.

The function loadXMLDoc(), located in an external JavaScript, is used to load the XML file.

Create an element node

This example uses createElement() to create a new element node and appends it to a node using appendChild().

Create an attribute node with createAttribute

This example uses createAttribute() to create a new attribute node and inserts it into an element using setAttributeNode().

Create an attribute node with setAttribute

This example uses setAttribute() to create a new attribute for an element.

Create a text node

This example uses createTextNode() to create a new text node and appends it to an element using appendChild().

Create a CDATA section node

This example uses createCDATAsection() to create a CDATA section node and appends it to an element using appendChild().

Create a comment node

This example uses createComment() to create a comment node and appends it to an element using appendChild().

---

Create a New Element Node

The createElement() method creates a new element node:

Example

xmlDoc=loadXMLDoc("books.xml");

newel=xmlDoc.createElement("edition");

x=xmlDoc.getElementsByTagName("book");

x.appendChild(newel);

Try it yourself »

Example explanation:

1. Load "books.xml" into xmlDoc using loadXMLDoc()
2. Create a new element node <edition>
3. Append the element node to the first <book> element

Add an element to all <book> elements by looping through them: Try it yourself

---

Create a New Attribute Node

createAttribute() is used to create a new attribute node:

Example

xmlDoc=loadXMLDoc("books.xml");

newatt=xmlDoc.createAttribute("edition");

newatt.nodeValue="first";

x=xmlDoc.getElementsByTagName("title");

x.setAttributeNode(newatt);

Try it yourself »

Example explanation:

1. Load "books.xml" into xmlDoc using loadXMLDoc()
2. Create a new attribute node "edition"
3. Set the value of the attribute node to "first"
4. Add this new attribute node to the first <title> element

Add a new attribute node to all <title> elements by looping through them: Try it yourself

Note: If the attribute already exists, it will be replaced by the new one.

---

Create an Attribute Using setAttribute()

Since the setAttribute() method can create a new attribute if it doesn't exist, we can use this method to create a new attribute.

Example

xmlDoc=loadXMLDoc("books.xml");

x=xmlDoc.getElementsByTagName('book');

x.setAttribute("edition","first");

Try it yourself »

Example explanation:

1. Load "books.xml" into xmlDoc using loadXMLDoc()
2. Set (create) the "edition" attribute with the value "first" for the first <book> element

Add a new attribute to all <title> elements by looping through them: Try it yourself

---

Create a Text Node

The createTextNode() method creates a new text node:

Example

xmlDoc=loadXMLDoc("books.xml");

newel=xmlDoc.createElement("edition");

newtext=xmlDoc.createTextNode("first");

newel.appendChild(newtext);

x=xmlDoc.getElementsByTagName("book");

x.appendChild(newel);

Try it yourself »

Example explanation:

1. Load "books.xml" into xmlDoc using loadXMLDoc()
2. Create a new element node <edition>
3. Create a new text node with the text "first"
4. Append the new text node to the element node
5. Append the new element node to the first <book> element

Add an element node containing a text node to all <book> elements: Try it yourself

---

Create a CDATA Section Node

The createCDATASection() method creates a new CDATA section node.

Example

xmlDoc=loadXMLDoc("books.xml");

newCDATA=xmlDoc.createCDATASection("Special Offer & Book Sale");

x=xmlDoc.getElementsByTagName("book");

x.appendChild(newCDATA);

Try it yourself »

Example explanation:

1. Load "books.xml" into xmlDoc using loadXMLDoc()
2. Create a new CDATA section node
3. Append this new CDATA section node to the first <book> element

Add a CDATA section to all <book> elements by looping through them: Try it yourself

---

Create a Comment Node

The createComment() method creates a new comment node.

Example

xmlDoc=loadXMLDoc("books.xml");

newComment=xmlDoc.createComment("Revised March 2008");

x=xmlDoc.getElementsByTagName("book");

x.appendChild(newComment);

Try it yourself »

Example explanation:

1. Load "books.xml" into xmlDoc using loadXMLDoc()
2. Create a new comment node
3. Append this new comment node to the first <book> element

Add a comment node to all <book> elements by looping through them: Try it yourself