Ajax Basics must read: Some key technologies in Ajax

The main technologies involved in AJAX AJAX architectures:
Client:javascript parsing XML, manipulating the DOM to modify HTML pages, JavaScript is the language of OO.
Server:servlet + DAO, the service interface can be implemented

The following are the main code in the client:
1. JS encapsulates the parsing XML code, as well as the instance application. Quote class, passing in the XML document and the name of the label that needs to be processed
function DataSet (xmldoc, Taglabel) {
This.rootobj = Xmldoc.getelementsbytagname (Taglabel)

3 methods
This.getcount = GetCount
This.getdata = GetData
This.getattribute = GetAttribute
}
function GetCount () {
Return this.rootObj.length
}
function GetData (index, tagName) {
if (index >= this.count) return "index Overflow"
var node = This.rootobj[index]
var str = node.getelementsbytagname (tagName) [0].firstchild.data
Return str
}

function getattribute (index, tagName) {
if (index >= this.count) return "index Overflow"
var node = This.rootobj[index]
var str = node.getattribute (tagName)
Return str
}
How to use the DataSet class
function Updatebyxml (xmldoc) {

var employeeds = new DataSet (xmldoc, "employee"); Care about the label name
var count = Employeeds.getcount ()
for (i=0;ivar name = Employeeds.getattribute (i, "name")
var job = Employeeds.getdata (i, "job")
var salary = Employeeds.getdata (i, "salary")
Alert (name + "," + Job + "," + salary)
}
The XML format used is similar to the following



Programmer
32768


Bum
70000


Harbin Ceo
100000

2. Manipulate the DOM, create a table, and display the data obtained Quote function deleteoldtable () {
Delrow = document.getElementsByTagName ("table"). length
This sentence is only used in this example, because there is already a table in this example, so you can't delete it, you need to change the 2005.11.17
if (delrow = 1) return

var node = document.getelementsbytagname ("table") [delRow-1]; Form
var C = Node.childNodes.length
for (i=0;iNode.removechild (Node.childnodes[0]); Delete all cell rows
}

An instance of the incoming dataset can be
function Maketable (m_ds) {

Deleteoldtable ()////First clear previous results

var table = document.createelement ("table");
Table.setattribute ("Border", "1");
Table.setattribute ("width", "100%");

Document.body.appendChild (table);
var header = Table.createthead ();
var headerrow = header.insertrow (0);
Headerrow.insertcell (0). appendchild (document.createTextNode ("name"));
Headerrow.insertcell (1). AppendChild (document.createTextNode ("occupation"));
Headerrow.insertcell (2). AppendChild (document.createTextNode ("wages"));

For (var i=0;ivar name = M_ds.getattribute (i, "name")
var job = M_ds.getdata (i, "job")
var salary = M_ds.getdata (i, "salary")

var row = Table.insertrow (i+1);
Row.insertcell (0). appendchild (document.createTextNode (name));
Row.insertcell (1). appendchild (document.createTextNode (Job));
Row.insertcell (2). appendchild (document.createTextNode (Salary));
}
}