Introduction to Web-Ajax

Technical Exchange, DH explanation.

Today, everything is simple. Let's fly over it.
Ajax requests are implemented by the XMLHTTPRequest object. the problem is that the IE and W3C standards are different, so we need to judge the browser when creating XMLHttpRequest in JS. Of course, the simple method is as follows:

 
VaR request = false; try {request = new XMLHttpRequest ();} catch (trymicrosoft) {try {request = new activexobject ("msxml2.xmlhttp");} catch (othermicrosoft) {try {request = new activexobject ("Microsoft. XMLHTTP ") ;}catch (failed) {request = false ;}} if (! Request) Alert ("error initializing XMLHttpRequest! ");
 

Of course, the XMLHTTP version in IE is more than the two I wrote above. It seems that there are five. You can write an array and create ActiveX cyclically.
After the XMLHTTPRequest object is created, we will use the method provided by it. For details about the methods and attributes, see msdn and other websites.

XMLHttpRequestObjectOpen ()Method. This method has five parameters:

• Request-type: Type of the request to be sent. The typical value isGetOrPost, But can also be sentHeadRequest.
• URL: URL to be connected.
• Asynch: True if you want to use an asynchronous connection; otherwise, false. This parameter is optional. The default value is true.
• Username: If you need authentication, you can specify the user name here. This optional parameter has no default value.
• Password: If you need authentication, you can specify a password here. This optional parameter has no default value.

The first three parameters are usually used. In fact, even if an asynchronous connection is required, the third parameter should be specified as "true ". This is the default value, but it is easier to understand whether the request is asynchronous or synchronous.
The following example shows how to synchronize the homepage of GET request 163.Source code:

 
VaR url = "http://www.163.com"; request. Open ("get", URL, false); Request. Send (null );
 

After talking about synchronization, some may want to know how to implement Asynchronization? Let's take an example:

VaR url = "http://www.163.com"; request. open ("get", URL, true); Request. onreadystatechange = updatepage; request. send (null);} function updatepage () {alert ("server is done! ");}
 

If you go to the experiment, you will find that this dialog box appears many times. Why? That's because there is another thing we didn't say:

The HTTP readiness status indicates the Request status or situation. It is used to determine whether the request has started, whether the response has been received, or whether the request/response model has been completed. It can also help determine whether to read the response text or data provided by the server is secure. In Ajax applicationsProgramFive readiness statuses are required:

• 0: The request is not sent (Open ()Before ).
• 1: The request has been created but has not been issued (callSend ()Before ).
• 2: The request is being processed (the content header can be obtained from the response ).
• 3: The request has been processed, and some data is usually available in the response, but the server has not yet completed the response.
• 4: The response has been completed. You can access the server response and use it.

Therefore, we should judge whether the request status is 4 in the updatepage function.

Function updatepage () {If (request. readystate = 4) Alert ("server is done! ");}
 

Here we also need to talk about an HTTP Status Code. For example, if a webpage is found to be 200, or a webpage error is 404, do we need to check whether the homepage of the webpage has been opened, so we should change it again:

 
Function updatepage () {If (request. readystate = 4) if (request. status = 200) Alert (request. responsetext); else if (request. status = 404) Alert ("request URL does not exist"); else alert ("error: status code is" + request. status );}
 

In this way, the HTML of the homepage will pop up.Code.
Finally, I have to talk about the request methods in addition to get, post, head, put, etc. What are the differences? You can check the information by yourself, which is conducive to your learning.
The attributes and methods of XMLHttpRequest derived from msdn are as follows:

Onreadystatechange
Sets or retrieves the event handler for asynchronous requests.

Readystate
Retrieves the current state of the Request operation.

Responsebody
Retrieves the response body as an array of unsigned bytes.

Responsetext
Retrieves the response body as a string.

Responsexml
Retrieves the response body as an XML Document Object Model (DOM) object.

Status
Retrieves the HTTP status code of the request.

Statustext
Retrieves the friendly HTTP status of the request.

Abort
Cancels the current HTTP request.

GetAllResponseHeaders
Returns the complete list of response headers.

GetResponseHeader
Returns the specified response header.

Open
Assigns method, destination URL, and other optional attributes of a pending request.

Send
Sends an HTTP request to the server and has es a response.

SetRequestHeader
Adds custom HTTP headers to the request.

 

I hope to give some help to new users, because I am also a newbie. Okay, I am DH.