spacer

Webref WebRef   Sitemap · Experts · Tools · Services · Newsletters · About i.com

home / experts / javascript / column102


Web Services, Part VII: XML Object's Nodes and Types

Sr. Web Developer
mediabistro.com
US-NY-New York

Justtechjobs.com Post A Job | Post A Resume
Developer News
Microsoft Shows Off Silverlight 4, IE9 Plans
Metasploit Expands Vulnerability Test Framework
HyperCard Reborn?


Creating a New Element Node

The DOMDocument object exposes the CreateElement() method. Creating an element with this method is the same as creating a node with createNode() where the type is "element" and no namespace is specified. In order to create a namespace-qualified attribute, use the createNode() method. You can only set the name of the element with createElement(). Set the text property of the node to set the content of the element.

Notice that when you create the element object, it is not automatically connected to the current document's tree. Its ownerDocument property is equal to the document object, but its parentNode property is null. Use one of the three inserting methods to hook the new element object to the document tree: insertBefore(), replaceChild(), or appendChild().

The syntax of the method is:

createElement(tagName)

where tagName is a string specifying the new tag name. This name will be echoed in the new node's nodeName property.

Let's look at an example. First, let's read our mydvd XML file:

var xmlDoc = new ActiveXObject("Msxml2.DOMDocument");
xmlDoc.async = false;
xmlDoc.load("mydvd.xml");

Set the root node:

root = xmlDoc.documentElement;

We want to add a new tag, preparedby. This tag will include the name of the person that prepared the sales report of the mydvd store. Creating the element is straightforward:

newElem = xmlDoc.createElement("preparedby"); 

We need to decide now where to put the new tag. We decided to add it to the <summary> tag, which is the root's (<sales>'s) first child. We can append the new tag to <summary>'s tags. Here is the code:

root.childNodes.item(0).appendChild(newElem);

We can assign a value to the new tag:

root.childNodes.item(0).lastChild.text = "Yehuda Shiran";

The addElement() function summarizes the above:

function addElement() {
  var xmlDoc = new ActiveXObject("Msxml2.DOMDocument");
  var root;
  var newElem;
  xmlDoc.async = false;
  xmlDoc.load("mydvd.xml");
  alert(xmlDoc.documentElement.xml);
  root = xmlDoc.documentElement;
  newElem = xmlDoc.createElement("preparedby");
  root.childNodes.item(0).appendChild(newElem);
  root.childNodes.item(0).lastChild.text = "Yehuda Shiran";
  alert(xmlDoc.documentElement.xml);
}

Try it now. The first alert box echoed the XML file before adding the element node. The second alert box reflects the addition. Notice the preparedby tag, the fourth and last child of the <summary> tag.


Next: How to create a new attribute node

http://www.internet.com

internet.commediabistro.comJusttechjobs.comGraphics.com

Search:

WebMediaBrands Corporate Info

Legal Notices, Licensing, Permissions, Privacy Policy.
Advertise | Newsletters | Shopping | E-mail Offers | Freelance Jobs

webref The latest from WebReference.com Browse >
Rolling Out Your Own HTML Application Version Control · HTML 5: Client-side Storage · Working with Ajax Server Extensions
Sitemap · Experts · Tools · Services · Email a Colleague · Contact FREE Newsletters 
 The latest from internet.com
Wi-Fi Product Watch, November 2009 · Chip Market Recovering From '08 Collapse · Low-Cost Tools to Kickstart Your New Business


Produced by Yehuda Shiran and Tomer Shiran
All Rights Reserved. Legal Notices.
Created: January 28, 2002
Revised: January 28, 2002

URL: http://www.webreference.com/js/column102/5.html