Roaming through XMLDOM: An AJAX Prerequisite - Manipulating the XML Document

(Page 4 of 4 )

The XMLDOC object also has a large number of methods that can be invoked to create, modify, and delete nodes. The document object represents the XML file in its entirety and is also a node in the DOM. It has a large number of properties and many methods. For complete documentation the reader is referred to the W3C site. In addition to W3C there are also Microsoft extensions.

Adding a new student to the web class

Being a node, XMLDOC shares the properties of the nodes as well. A complete usage of the methods is not attempted, but a few examples are shown as related to the XML document we have been considering, the WebClass.xml file. XMLDOC object's methods will be invoked to add another student to the web class file. This is what a student node looks like. We will add another student according to this scheme.

<student id="1">

  <name>Linda Jones</name> 

  <legacySkill>Access, VB5.0</legacySkill>

  </student>

Looking at the node, student, we see that in order to add a new student node we need to add the name and legacySkill child nodes. Also we need to add the attribute Id and give a value to it. Finally we need to add the proper texts for the name and legacySkill nodes.

We assume that the new student will have:

id --> 7
name-->John Doe
legacySkill-->Fortran, Soroban

The code for adding the new student is as follows:

//This creates a new student:
var newElem= xdoc.createElement("student");

//This line creates the attribute to the new student:
var newAtt=newElem.setAttribute("id",7);

//The next two lines creates elements name and legacySkill
var part1=xdoc.createElement("name");
var part2=xdoc.createElement("legacyskill");

//The next two lines create the required text for the nodes:
var newText1=xdoc.createTextNode("John Doe ");
var newText2=xdoc.createTextNode("Fortran, Soroban");

//Appending the name and legacySkill to the student node
var part11=newElem.appendChild(part1);
var part21=newElem.appendChild(part2);

//Adding the text content to the name and legacySkill nodes
part11.appendChild(newText1); 

part21.appendChild(newText2);

In this fashion you build the tree so that the node is defined according to the blueprint from the XML document. This completes the building of the student node.

Verifying the new student information

In order to verify, we again invoke the XMLDOC's properties as shown in the early part of this tutorial. In particular we will be using the following code to verify:

//We created newElem and the node's name is given by: document.write(newElem.nodeName);

//We get the following result for this line:
student

//We have not added the newElem to xdoc and presently the number of //nodes in xdoc are given by:
var totalnodes=xdoc.getElementsByTagName("student");
document.write("<br>"+totalnodes.length);

//the result of this code gives the number of student nodes in xdoc:
4

//We look at the attributes of the new student node:
document.write("<br>"+ newElem.attributes[0].name);
document.write("<br>"+ newElem.attributes[0].value);

//We get the following result for the above code snippet:
id
7

//We now grab the text for the entire student node:
document.write("<br>"+newElem.text);

//This snippet gives the following browser display:
John Doe Fortran, Soroban

//Now we get a reference to the last child of the xdoc before adding the //new student:
var lastnode=xdoc.lastChild;

//This is important. We add the newElem student node to the xdoc:
lastnode.appendChild(newElem);

//We now count the number of nodes in the new document which have //the student nodes:
var totalnodes=xdoc.getElementsByTagName("student");
document.write("<br>"+totalnodes.length);              

//The result of this in the browser display is:
5

This verifies that the new student has been added (we started out with 4). The file can be saved using the save (ObjTarget) method of the XMLDOC object.

Summary

Understanding and manipulating the XMLDOM objects is a prerequisite to writing successful code, whether it be for AJAX or for anything to do with XML files especially using Microsoft tools. It is the author's hope that the surgical presentation of this tutorial in dissecting the XMLDOM object will provide a guide to this understanding. XMLHTTP request is another object belonging to the XMLDOM; it is discussed in a previous tutorial and will be revisited again in discussing the responseXML method of the request object. 

DISCLAIMER: The content provided in this article is not warranted or guaranteed by Developer Shed, Inc. The content provided is intended for entertainment and/or educational purposes in order to introduce to the reader key ideas, concepts, and/or product reviews. As such it is incumbent upon the reader to employ real-world tactics for security and implementation of best practices. We are not liable for any negative consequences that may result from implementing any information covered in our articles or tutorials. If this is a hardware review, it is not recommended to open and/or modify your hardware.

Comments On: Roaming through XMLDOM: An AJAX Prerequisite

· Object model is the most important thing. Once you know the object, you know a lot...    · for bringing this all together in one place. You saved readers tons of time that...    · Thanks for the kind comments. This is what you will find in most of my tutorials,...   >>> Post your comment now!