Parsing XML message and update to DOM

text zoom

Previous: Building response XML message in server XmlHttpRequest object,how to use? :Next

Parsing XML message and update to DOM:
Now,after receiving XML message,we need to parse it to get suggestions and the book list and then update to DOM. The callback JavaScript updateBooks() will do this. Its code includes two parts: update suggestion and books

The section code below is to get the root document of the XML message:

// Get XML response message
var XMLresponse = oXMLRequest.responseXML;

// Point to the ‘book_response’ node
var docRoot = XMLresponse.getElementsByTagName("book_response")[0];

In order to get and update suggestion using the XML structure shown above,we do as:

// Get data of the Suggestion node
var strSuggestion = docRoot.childNodes[0].firstChild.data;

// Get a HTML DOM object that need to be updated
var suggestionHTMLDiv = document.getElementById("suggestion");
f (document.all)
{
suggestionDiv = document.all["suggestion"];
}

// Display the received suggestion
suggestionHTMLDiv.innerHTML = "<div>" strSuggestion "</div>";

We update the book list similar to the given suggestion. However,we should notice the way to get data from the tree node.

// Get the books HTML DOM object
var bookHTMLText = document.getElementById("books");
if (document.all)
{
bookHTMLText = document.all["books"];
}

// Point to the Books node
var oBooks = docRoot.childNodes[1];

// Parse XML message to build a book list
var strBooks = "";
for (var i = 0; i < oBooks.childNodes.length; i )
{
             if (strBooks == "")
            {
                      strBooks = oBooks.childNodes[i].firstChild.data;
             }
             else
             {
                          strBooks = strBooks "," oBooks.childNodes[i].firstChild.data;
              }
}

// Display the books list
bookHTMLText.value = strBooks;

For demonstration of running this application,you could refer to the Example of Ajax section