Resolve the compatibility problem between creating the ajax core XMLHTTPRequest object and the browser

The MLHttpRequest object is the core of AJAX functions. To develop an AJAX program, you must first understand the XMLHttpRequest object.

To understand the XMLHttpRequest object, you must first create the XMLHttpRequest object and create the XMLHttpRequest object in different browsers using different methods:

First, let's take a look at how IE creates the XMLHttpRequest object (method 1 ):

 Var xmlhttp = ActiveXobject ("Msxml12.XMLHTTP"); // create an Msxml12.XMLHTTP object in a newer IE version

 Var xmlhttp = ActiveXobject ("Microsoft. XMLHTTP"); // create a Microsoft. XMLHTTP object in older IE versions

Mozilla, Opera, Safari, and most non-IE browsers use the following method (method 2) to create the XMLHttpRequest object:

 Var xmlhttp = new XMLHttpRequest ();

Note: Internet Explorer uses an object named XMLHttp instead of an XMLHttpRequest object, mozilla, Opera, Safari, and most non-Microsoft browsers use the latter (hereinafter referred to as XMLHttpRequest objects ). IE7 began to use the XMLHttpRequest object.

Therefore, we need to create an XMLHTTPRequest object compatible with multiple browsers:

Method 1:

 Var xmlhttp = false;// Create a new variable and assign a value of false. If false is used as the judgment condition, the XMLHTTPRequest object has not been created.

 Function CreateXMLHttp (){

 Try {

  Xmlhttp = new XMLHttpRequest ();//Try to create the XMLHttpRequest object. all browsers except IE support this method.

} Catch (e ){

 Try {

 Xmlhttp = ActiveXobject ("Msxml12.XMLHTTP ");//Use a newer version of IE to create IE-compatible objects (Msxml2.XMLHTTP ).

} Catch (e ){

 Try {

 Xmlhttp = ActiveXobject ("Microsoft. XMLHTTP ");//Use older versions of IE to create IE-compatible objects (Microsoft. XMLHTTP ).

} Catch (failed ){

 Xmlhttp = false; // keep it false if it fails.

}

}

}

Return xmlhttp;

}

Example of success:

If (! Xmlhttp ){

 An error occurred while creating xmlhttp.

} Else {

 Xmlhttp created

}

Method 2:
 If (typeof (XMLHttpRequest) = "undefined" & window. ActiveXObject ){

 Function XMLHttpRequest (){

 Var xmlhttp_arr = ["MSXML2.XMLHTTP", "Microsoft. XMLHTTP"];

 Var xmlhttp;

 For (I = 0; I <xmlhttp_arr.length; I ++ ){

  If (xmlhttp = new ActiveXObject (xmlhttp_arr [I])

  Break;

}

 Return xmlhttp;

}

}

// This is an XMLHttpRequest object created by a browser other than IE.

Var xmlhttp = new XMLHttpRequest ();

After successfully creating xmlhttp, let's take a look at some of its attributes and methods, as well as the most important onreadystatechange event handle.

 Method:

 Open () initializes http request parameters, including URLs and http methods, but does not send requests;

 Abort () cancels the current response, closes the connection, and disconnects all activities that have not ended;

 GetAllResponseHeaders () returns the http Response Header as an unparsed string;

 GetResponseHeaders) returns the value of the specified http response header;

 Send () sends an http request using the parameters passed to the open () method, and transmits an optional request body for this method;

 SetResponseHeader () is used to set or add an Http request to an open but not sent request.

 Attribute:

 ReadyState indicates the status of the http request.

 0 indicates no initialization;

 1 indicates reading

 2 indicates read

 3. Interaction in progress (in acceptance)

 4 completed

)

 ResponseText indicates the response body received by the server. If no data is received, an empty string is returned;

 ResponseXML indicates that the response to the request is parsed to XML and returned with the document object;

 Status indicates the status of the http request;

 StatusText indicates that the http Request status is named instead of a number;

 Onreadystatechange is the function that calls the event when the readySate status changes.

The following is an xmlhttpRequest object that sends the request data and returns the result;

 Generate an XMLHTTPRequest object

  Var xmlhttp = CreatXMLHttp ();
  Xmlhttp. open ("get", "http://www.jb51.net/jaryle", true );
  Xmlhttp. onReadyStateChange = getresult;
// How can I tell the XMLHttpRequest object who will handle this change when the state changes? Two methods are used: one is the anonymous method xmlhttp. onReadyStateChange = function () {code for processing changes}
Another method: specify the method: xmlhttp. onReadyStateChange = getresult;
   Function getresult () {code for processing changes}
  Xmlhttp. send ();
  Function getresult (){
  If (xmlhttp. readyState = 4) {// when the readyState state is 4, the data is received.
  If (xmlhttp. status = 200 ){// This requires the status attribute, that is, the HTTP status code returned by the server. When xmlhttp. status is 200, it indicates that the transmission process is complete and there is no error.
  Alert (xmlhttp. responseText );
}
}
  }

Note:Therefore, we should follow the above process to remember: Create an XMLHttpRequest object-> specify the Sending address and sending method-> specify the processing method of status change-> send request, after the request is sent, the specified processing method is automatically called when the status changes..