Presented here is an introduction to remote scripting using the XMLHttprequest (XHR) object now called AJAX. The term AJAX, Asynchronous Javascript And Xml, was coined by Jesse James Garrett in his article Ajax: A New Approach to Web Applications. The XHR object was introduced by Microsoft and emulated by the Mozilla/Netscape group much earlier, but it didn't garner broad interest until it had a snappy acronym. If you haven't read the general introductory material on remote scripting, you may want to. It's a quick read.
The code presented here and the code for iframe technique have been completely rewritten to provide transparent selection of either method depending on browser support.
AJAX gives a performance improvement over the iframe technique, because it doesn't need to send a complete HTML page. Most current browsers support it. The iframe technique, which works in most older browsers supporting iframes and DHTML, is available if older browsers need to be supported. The way this code is written, when the browser does not support the XHR object, it will use the iframe technique.
Support for the XHR object is found in most recent releases of popular browsers (IE from 5.0, Mozilla/Netscape/Firefox, Opera 8, Safari 1.2), and will likely be standard in all new browsers.
The XHR object handles the communication with the server and caching of the returned data. An RPC is made when the object's send method is called. That initiates an HTTP request for a specific URL.
There are two HTTP methods of interest for RPCs: GET and POST. These are the same methods found in the form tag. This tutorial uses the GET method exclusively because it is compatible with the iframe technique. Simulating the POST method in iframes is less adaptable to blending with the XHR object.
Parameters for the RPC are sent as a search or query string appended to the URL. The URL usually is a server-side script (a procedure) that does some processing before returning data; although, static data can be returned. Returned data is formatted as plain text or XML. Once the data has been received, client-side processing is done to display it in the Web page.
This process can be synchronous, waiting until the it is finished before the script continues, or asynchronous, allowing the script to continue while the data transfer happens in the background. Asynchronous is usually recommended.
The benefits of this technque are: