Professional JavaScript For Web Developers

Chapter 15
To load the file asynchronously, use the readyState property and the onreadystatechange event
handler.
The readyState property has five possible values:
❑
❑
❑
❑
❑
0 — The DOM hasn’t been initialized with any information.
1 — The DOM is loading data.
2 — The DOM has completed loading the data.
3 — The DOM may be used although some sections may not be available.
4 — The DOM is completely loaded and ready to be used.
Whenever the readyState property changes from one value to another, the readystatechange event
is fired. If you use the onreadystatechange event handler, you are notified when the DOM has been
fully loaded:
oXmlDom.onreadystatechange = function () {
if (oXmlDom.readyState == 4) {
alert(“Done”);
}
};
You must assign the onreadystatechange event handler before you call the load() method, as shown
in the following:
oXmlDom.onreadystatechange = function () {
if (oXmlDom.readyState == 4) {
alert(“Done”);
}
};
oXmlDom.load(“test.xml”);
Now when the file is completely loaded, you see the alert Done.
You may note that the event handler code uses oXmlDom instead of the this keyword.
This is a peculiarity of ActiveX objects in JavaScript: The this keyword doesn’t
always work as expected. To avoid any problems, it’s best to use the full variable
name in the event handler.
448
Whether you choose to load files synchronously or asynchronously, the load() method can be used
with a partial, relative, or full path to the XML file, such as in the following:
oXmlDom.load(“test.xml”);
oXmlDom.load(“../test.xml”);
oXmlDom.load(“http://www.mydomain.com/test.xml”);
The partial and relative paths are always calculated from the page using the XML DOM object, just as a
link or image would be.