With the growth of Web applications, websites have been trying to make user interaction similar to that found in desktop applications. The largest push is towards making Web interfaces more dynamic: if data changes, say a new email arrives in your inbox in GMAIL, the Web page should update and display the new email without reloading the whole page. The page should always be available to the user and always responsive to their input. While the DOM allows for such dynamic updates to occur, AJAX is an important group of technologies that allows a Web page to request more information from the server (such as an updated list of email in an inbox) without having to reload the whole page. Together, AJAX and the DOM can be used to create dynamic Web pages, and this chapter will introduce you to how that can be done.

AJAX stands for Asynchronous JavaScript and XML. It allows a Web page to make a request to a Web server for information using standard HTTP, but without reloading the page, and without automatically displaying the information returned from the server. These requests are all made programmatically, using JavaScript, and data communication is often done using XML, as JavaScript can easily parse this data. After receiving the data from the server, the JavaScript script can use the returned data however it wishes. The requests can also be made in a such a way that the JavaScript code does not have to wait for a reply from the server. Instead, the JavaScript code is notified when the page has finished receiving the information. In this way, the script can continue to perform useful actions while the data downloads from the server – this makes the communication asynchronous to any action that the Web page is performing.

It is important to realise that AJAX itself refers to a group of related technologies, not all of which are standardised, and not all of which need to be used at once. For instance, it can often be more convenient to communicate with the server using plain text rather than XML, and these communications need not occur asynchronously. Various other technologies are often employed in addition to those making up the AJAX name itself. The original article that defined the term AJAX ( http://www.adaptivepath.com/ideas/essays/archives/000385.php) lists the following technologies:

Most of these technologies are discussed elsewhere in these notes. The rest of this chapter will examine how XMLHttpRequest can be used to communicate with the Web server.

var httpRequest;
if (window.XMLHttpRequest) { // Mozilla, Safari, ...
    httpRequest = new XMLHttpRequest();
} else if (window.ActiveXObject) { // IE
    httpRequest = new ActiveXObject("Microsoft.XMLHTTP");
}