Ajax--xmlhttprequest

The XMLHttpRequest object. Enables the AJAX program to update the page data without loading the page again, accepting data from the server after the page is loaded. this reduces the server burden and recalls the responsiveness, shortens the user's waiting time, and makes the Web program more similar to traditional desktop applications.

XMLHttpRequest Object 4-Step usage:

1. Create a XMLHttpRequest object.

To build XMLHttpRequest objects, depending on the browser version number to build, because IE5.0 and iE6.0, developers can use the XMLHTTP ActiveX components inside the Web page to extend their own functionality , and from the IE7 version number and other vendors ' browsers, start creating the proxy class XMLHttpRequest that inherits the XML. So the creation will be different.

         var xmlhttp;//defining global Variables  

<span style= "White-space:pre" &GT;&LT;/SPAN&GT;//1. Create a XMLHttpRequest object if (window.                XMLHttpRequest) {//firefox and other browsers, IE7, 8 and later are applicable xmlhttp = new XMLHttpRequest ();                if (xmlhttp.overridemimetype) {xmlhttp.overridemimetype ("text/xml"); } else if (window. ActiveXObject) {//IE5, 6 version number of version number for var activexname = ["MSXML2. xmlhttp.6.0 "," MSXML2. xmlhttp.5.0 "," MSXML2. xmlhttp.4.0 "," MSXML2. xmlhttp.3.0 "," MSXML2.                    XMLHTTP "," miscrosoft.xmlhttp "]; for (var i = 0; i < activexname.length; i++) {try {xmlhttp = NE                            W ActiveXObject (Activexname[i]);                        Break } catch (E) {}}} if (xmlhttp==undefined | | xmlh                 Ttp==null) {alert ("The current browser does not support the creation of XMLHttpRequest objects");   Return }

2. Register callback function

                2. Register a callback method                Xmlhttp.onreadystatechange = callback;

3. Use the Open method to set up information that interacts with the server and set the data to be sent .

The Open method also has a get and post submission method. Post the way it is. To set its header file, and send it with the number of references that need to be sent

                Get mode interactive                //3. Sets the corresponding number of parameters for the server interaction                xmlhttp.open ("GET", "Htmlpage1.ashx?").
Username= "+ username, true);                Sets the data sent by the server side.
Start and server interaction                xmlhttp.send (NULL);

                Post mode interactive                //3. Use Open. Sets the corresponding number of parameters for the server interaction                xmlhttp.open ("POST", "Htmlpage1.ashx", true);                Xmlhttp.setrequestheader ("Content-type", "application/x-www-form-urlencoded");              Post means the code to be added, header file                //Set data sent by server side. Initiates interaction with the server. And the pass-through parameter                xmlhttp.send ("username=" + username);

4. Infer whether the interaction is complete in the callback function. The response is correct. The data returned by the server side is also available on request. Update the page content.

                callback function                callback ()                {                    //5. Inference and the server's interaction is complete, whether the server side correctly returns the data                    if (xmlhttp.readystate = = 4) {/ /indicates that the server-side interaction has been completed                        if (xmlhttp.status = = 200) {//indicates the correct method to return the data                            //Plain text method accept                            var message = Xmlhttp.responsetext;                            XML data corresponding Dom object Acceptance method                            //Use premise is, server side need                            to set//memory to div tag add text content                            var div1 = document.getElementById (" Message ");                            div1.innerhtml = message;}}                }

Specific properties and methods of XMLHttpRequest:

o Pen ()	Specifies the HTTP method (post or get) of the server-side interaction, the URL address, whether the asynchronous information
Send ()	Makes a request to the server, assuming that it is asynchronous, that the method returns immediately and its contents can be null. The DOM object. Input stream, string
Setrequestjeader ()	Sets the header file for HTTP, which is called after the Open method.
getAllResponseHeaders ()	Includes all the corresponding header file information for HTTP.
getResponseHeader ()	Returns the corresponding value of the key header specified in the corresponding header file for HTTP.
Abort ()	Stops the current HTTP request and the corresponding XMLHttpRequest object is reset to an uninitialized state
ReadyState	Status of the asynchronous operation: uninitialized (0), loading (1), loading (2), Interaction (3). Completed (4)
onReadyStateChange ()	Event trigger for request state change. (Can register function)
ResponseText	The text content of the server response.
Responsexml	The XML content of the server response corresponding to the DOM object
Status	The HTTP status code returned by the server. 200 successes.
StatusText	Server returns text information for status codes

Summarize:

In an AJAX application, the XMLHttpRequest object is responsible for sending the user information asynchronously to the server side and receiving the server response information and data.

Ajax--xmlhttprequest