XMLHttpRequest object components are XMLHttp through this object, Ajax can be the same as desktop applications with the server only the exchange of data layers without having to refresh every time interface, the data do not have to deal with each of the work to the server to to do; This will not only alleviate the burden on the server also recalled the response speed, which has shortened the waiting time for users.
XMLHttpRequest Object and Ajax
At Ajax application, XMLHttpRequest object is responsible for the user to asynchronous communication and information sent to the server side and receives the server response to information and data.
XMLHttpRequest object property and method.
IE5.0 onwards, developers will be able to WEB page using XMLHTTP ActiveX components within the expansion of its own function, and Mozilla1.0 and create a succession NetScape7 is XML-agent type XMLHttpRequest; for most of XMLHttpRequest and XMLHttp components are similar, methods and similar property are only part of a different property. Demonstrated the following code in IE and NetScape browser, such as the creation of XMLHttpRequest object.
/ / Define a variable var http_request = false;
/ / IE browser, create http_request = new ActiveXObject ( "Msxml2.XMLHTTP ");// new version of IE
http_request = new ActiveXObject ( "Microsoft.XMLHTTP ");// old version of IE
/ / Netscope browser http_request = new XMLHttpRequest ();
Are required attention at Microsoft's latest version of IE7.0 browser has also been supported XMLHttpRequest, which means that the Medium IE7.0 simultaneously two kinds of support, as well as on the way to create. AJAX in our application development must pay attention to the type of browser compatibility.
Can create is as follows:
var http_request = false;
function createXMLHttpRequest ()
http_request = false;
/ / Initialize the XMLHttpRequest object to start if (window.XMLHttpRequest) / / If it is window.XMLHttpRequest object (
/ / Mozilla, netscape browser http_request = new XMLHttpRequest ();
if (http_request.overrideMimeType) (/ / set the MIME types / / some versions of the browser deal with the server at the back does not contain XML mime-type head and the content of information will be error, therefore, to ensure that the back contains text / xml information.
http_request.overrideMimeType ( "text / xml");
else if (window.ActiveXObject) / / If it is window.ActiveXObject
/ / IE browser try
http_request = new ActiveXObject ( "Msxml2.XMLHTTP ");// IE newer version)
http_request = new ActiveXObiect ( "Microsoft.XMLHTTP"); / / ie older version)
catch (e) ()
if (! http_request)
/ / Abnormal, the failure to create object instance window.alert ( "Can not create XMLHttpRequest object instance.");
This is a simple creation of cross-browser method.
In addition XMLHttpRequest object to provide a series of attributes and methods, to server-side initiated asynchronous HTTP request, the monitor server status, and complete data on the server to respond to treatment after receiving the information back server-side data. The following is its description:
XMLHttpRequest Object Properties
onreadystatechange: specify when readyState property changes deal with the case handler, write-only property.
XMLHttpRequest Object readyState property onreadystatechange are case triggers a state of change, used to specify when the readyState property changes happen at the time of treatment case. In the use of the process, usually through the case handle onreadystatechange function name given way to the specified XMLHttpRequest Trigger Event, and in the case deal with a state function to determine the value of readyState and make the appropriate treatment.
As: http_request.onreadystatechange = processRequest; processRequest case treatment as a function of the body in the ProcessRequest function readyState status at the beginning of the implementation of 4:00.
readyState: Return the current status of the request, read-only property.
These state with a length of 4 plastic figures that state the meaning of its property is as follows:
0: not initialized (the object has been set up, but not initialized, that is not yet call the open method to create http request)
1: initialize (object has been set up, but did not call the send method to send http request)
2: Send data (send method has been called, but the current state as well as the http header unknown)
3: data transmission (which was to receive part of the data, because the first http response and incomplete response at this time through a systematic approach to obtain part of the data error)
4: Send completed (the data has finished, when the response system can acquire a complete response data)
responseBody: the body will respond to information in order to return the form unsigned byte array, read-only property.
responseText: String in the form of return server response information, read-only property.
responseXML: will respond to information formatted as a XML Document object back, read-only property.
XMLHttpRequest object methods and the meaning is as follows:
abort: cancel the current request;
Grammar: http_request.abort (); call this method, the current state of the request back uninitialized.
getAllResourceHeaders: access to all of the corresponding http header information; like JSP in the HttpServletRequest object, the access request http request header information, grammar: headers = http_request.getAllResourceHeaders ();
getResourceHeader: in response to information obtained from the specified http header information.
Grammar: head = http_request.getResourceHeader ( "header-name");
open: create a new http request, and specify the request method, URL, and authentication information (username / password).
Grammar: http_request.open (method, url, async, user, password);
async as boolean value to specify whether the request is asynchronous mode, the default is true; If true, when the state change of state will call onreadystatechange property point to the callback function. If the server requires authentication, you should specify a user name and password.
send: send a request to the http server and receive response. Create http request, you can send http request to the server, send method is called grammar: http_request.send (varBody);
VarBody parameters in order to send content to the server. If there is no content to send, varBody parameters can be omitted, but the best Writing for the null, because if omitted Writing at Firefox will error, so for http_request.send (null);. This method of synchronous or asynchronous mode depending on the open method of async parameter.
setRequestHeader: a separate request for a head set.
status: Return the current HTTP request status code, read-only property. Such as: 404 = "File Not Found", 200 = "success"
statusText: Return the current HTTP request status line, read-only property.