Using XMLHttpRequest

Due to the differences between browser implementations of XMLHttpRequest, it’s necessary to create a special function in order to ensure that your code will work on all major browsers.

To do this, you must understand the three ways of creating an XMLHttpRequest object:

  • IE 5: request = new ActiveXObject("Microsoft.XMLHTTP")

  • IE 6+: request = new ActiveXObject("Msxml2.XMLHTTP")

  • All others: request = new XMLHttpRequest()

This is the case because Microsoft chose to implement a change with the release of Internet Explorer 6. Therefore, the code in Example 18-1 will work for all the following browsers and newer versions:

  • Windows Internet Explorer 5.0

  • Mozilla Firefox 1.0

  • Netscape 7.1

  • Apple Safari 1.2

  • Konqueror 3.0

  • Nokia S60

  • Google Chrome 1.0

  • Opera 8.0

Example 18-1. A cross-browser Ajax function
function ajaxRequest()
    try // Non IE Browser?
        var request = new XMLHttpRequest()
        try // IE 6+?
            request = new ActiveXObject("Msxml2.XMLHTTP")
            try // IE 5?
                request = new ActiveXObject("Microsoft.XMLHTTP")
            catch(e3) // There is no Ajax Support
                request = false
    return request

You may remember the introduction to error handling in the previous chapter, using the try...catch construct. Example 18-1 is a perfect illustration of its utility, because it uses the try keyword to execute the non-IE Ajax command, and upon success, jumps on to the final return statement, where the new object is returned.

Otherwise, a catch traps the error ...

Get Learning PHP, MySQL, and JavaScript now with the O’Reilly learning platform.

O’Reilly members experience live online training, plus books, videos, and digital content from nearly 200 publishers.