Article
XML and JavaScript in Mozilla
In my article, "Read and Display Server-Side XML with JavaScript", I discussed the manipulation of XML files using JavaScript in Microsoft Internet Explorer. In this article, I’ll explain how to read and use XML file data using JavaScript in Mozilla. We will see how to display tag values, tag attribute values, and more.
Henceforth, I won't explicitly mention Mozilla in this article, because we will be dealing with Mozilla only, which includes Netscape 6.x, 7.x. I’ll let you know specifically when I’m referring to Microsoft Internet Explorer (MSIE, or simply IE), however.
The Sample XML File
I'll use the same XML file that I used in my last article, so it's easier for those who have already dealt with that file to understand. Consider the following XML file:
<?xml version="1.0" ?>
<company>
<employee id="001" sex="M" age="20">Premshree Pillai</employee>
<employee id="002" sex="M" age="24">Kumar Singh</employee>
<employee id="003" sex="M" age="21">Ranjit Kapoor</employee>
<turnover>
<year id="2000">100,000</year>
<year id="2001">140,000</year>
<year id="2002">200,000</year>
</turnover>
</company>
As you can see, the above XML file shows a company's employees' details, with the name as the tag <employee>'s main (or node) value; other details such as an employee’s id, sex and age are given as attributes id, sex and age within the same tag. The file also shows the company's turnover, with the turnover figure as the tag <turnover>'s node value, and the year as an attribute year within the same tag.
In the sections that follow, we’ll manipulate the above XML file, so that it makes sense to us.
XML and JavaScript
Before we actually get into reading and further manipulating the XML file, it’s important to know whether the visitor is using Mozilla or some other browser.
Test for Mozilla
Obviously, you will not be coding your XML-based JavaScript application for one particular browser, when you can so easily extend support for other browsers. Yet, the way you code your application will depend on which browser the visitor is using.
To test for Mozilla, we can use a simple variable as follows:
var moz = (typeof document.implementation != 'undefined') && (typeof
document.implementation.createDocument != 'undefined');
The above variable can be used as a boolean variable:
if(moz) {
// Mozilla!!
} else {
// Something else...
}
Load the XML File
Once we’ve identified the browser, it's time to load the XML file:
var xmlDoc=document.implementation.createDocument("", "doc", null)
xmlDoc.load("someXMLFile.xml");
xmlDoc.onload = someProcessingFunction;
The first line in the above code creates an instance of the xmlDoc object; the second line loads the XML file we want (someXMLFile.xml, in this case); the third line is used to further process, or manipulate, the XML file we’ve just loaded.
Now, it would be better to create a different function to load the XML file:
var xmlDoc;
function importXML(file) {
xmlDoc=document.implementation.createDocument("", "doc", null)
xmlDoc.load(file);
xmlDoc.onload = readXML;
}
Premshree studies engineering in Information Technology at Mumbai
University, India. He's written articles for a range of popular Indian IT magazines, and his site, QikSearch has featured in 'Digit' Magazine - India's No. 1 technology magazine.