Summary of XMLHttpRequest object for getting started with Ajax

Time:2022-1-15

XMLHttpRequest provides a protocol for the client to communicate with the HTTP server
1: Create
IE : http_request = new ActiveXObject(“Msxml2.XMLHTTP”);
http_request = new ActiveXObject(“Microsoft.XMLHTTP”);
Non ie: http_ request = new XMLHttpRequest();
2: Onreadystatechange
Specifies the event handling handle when the readyState property changes
grammar
http_request .onreadystatechange = funcMyHandler;
3: ReadyState
Returns the current state of the xmlhttp request
Variable, this property is read-only, and the status is represented by an integer of length 4 It is defined as follows:
The 0 (uninitialized) object was created but not initialized (the open method has not been called)
1 (initialization) the object has been established and the send method has not been called
2 (send data) the send method has been called, but the current status and HTTP header are unknown
3 (in data transmission) some data has been received. Because the response and HTTP header are incomplete, an error will occur when obtaining some data through ResponseBody and responseText,
4 (finish) after receiving the data, you can obtain the complete response data through ResponseBody and responseText
4: ResponseBody
Returns server response data in a format
5: Responsestream
Returns a response letter in the form of an ADO stream object
6: ResponseText
Returns the response information as a string
remarks
Variable, this property is read-only and returns the response information as a string.
Xmlhttp attempts to decode the response information into a Unicode string. Xmlhttp sets the encoding of the response data as UTF-8 by default. If the data returned by the server has a BOM (byte – order mark), xmlhttp can decode any ucs-2 (big or little endian) or ucs-4 data. Note that if the server returns an XML document, this property does not handle the encoding declaration in the XML document. You need to use responsexml to handle it.
7: Responsexml formats the response information as an XML document object and returns it
remarks
Variable. This property is read-only. The response information is formatted as an XML document object and returned. If the response data is not a valid XML document, this property itself does not return xmldomparseerror. You can get the error information through the processed domdocument object.
8: Status returns the HTTP status code of the current request
Long shaping standard HTTP status code, defined as follows:
Number Description
100
Continue
101
Switching protocols
200
OK
201
Created
202
Accepted
203
Non-Authoritative Information
204
No Content
205
Reset Content
206
Partial Content
300
Multiple Choices
301
Moved Permanently
302
Found
303
See Other
304
Not Modified
305
Use Proxy
307
Temporary Redirect
400
Bad Request
401
Unauthorized
402
Payment Required
403
Forbidden
404
Not Found
405
Method Not Allowed
406
Not Acceptable
407
Proxy Authentication Required
408
Request Timeout
409
Conflict
410
Gone
411
Length Required
412
Precondition Failed
413
Request Entity Too Large
414
Request-URI Too Long
415
Unsupported Media Type
416
Requested Range Not Suitable
417
Expectation Failed
500
Internal Server Error
501
Not Implemented
502
Bad Gateway
503
Service Unavailable
504
Gateway Timeout
505
HTTP Version Not Supported
remarks
Long integer. This property is read-only and returns the HTTP status code of the current request. This property can be obtained only after the data is sent and received.
9: XMLHttpRequest: statustext member
statusText
Returns the response line status of the current request
10: Abort() method
Cancel current request
11: Getallresponseheaders() method
Gets all HTTP headers of the response
remarks
Each HTTP header name and value is separated by a colon and ends with \ R \ n. The send method cannot be called until it is completed.
12: Getresponseheader gets the specified HTTP header from the response information
Example:
xmlhttp.getResponseHeader(“Server”);
Output the server column in the HTTP header: the version and name of the current web server.
remarks
The send method cannot be called until it succeeds. If the document type returned by the server is “text / XML”, this sentence xmlhttp getResponseHeader(“Content-Type”); The string “text / XML” will be returned. You can use the getallresponseheaders method to get the complete HTTP header information.
13: The open () method creates a new HTTP request and specifies the method, URL, and authentication information for the request
grammar
XMLHttpRequest.open(strMethod, strUrl, blnAsync, strUser, strPassword);
parameter
strMethod
HTTP methods, such as post, get, put, and propfind. Case insensitive.
strUrl
The requested URL address can be absolute or relative.
Blnasync [optional]
Boolean, which specifies whether the request is asynchronous. The default is true. If true, the callback function specified by the onreadystatechange property will be called when the state changes.
Async is a Boolean value. If it is asynchronous communication (true), the client does not wait for the response of the server; If the synchronization mode is false, the client will wait until the server returns a message before performing other operations. We need to specify the synchronization method according to the actual needs. In some pages, multiple requests may be sent, or even large-scale high-intensity requests organized, planned and formed. The latter will overwrite the previous one. At this time, of course, we need to specify the synchronization method: flame.
Struser [optional]
If the server needs authentication, specify the user name here. If not specified, the authentication window will pop up when the server needs authentication.
Strpassword [optional]
The password part of the authentication information. If the user name is empty, this value will be ignored.
remarks
After calling this method, you can call the send method to send data to the server.
14: Send() method
Send the request to the HTTP server and receive the response
XMLHttpRequest.send(varBody);
parameter
varBody
Data to be sent through this request.
remarks
The synchronous or asynchronous mode of this method depends on the basync parameter in the open method. If basync = = false, this method will wait for the request to complete or expire before returning. If basync = = true, this method will return immediately.
15: Setrequestheader specifies an HTTP header of the request separately
Example:

Copy codeThe code is as follows:
var http_request= false;
function send_request(url)
{/ / initialize, specify the processing function, and send the request function

if (window.XMLHttpRequest) //Mozila
{
http_request = new XMLHttpRequest();
if (http_request.overrideMimeType)
{
http_request.overrideMimeType(“text/xml”);
}
}
else
if (window.ActiveXobject) //IE
{
try
{
http_request = new ActiveXObject(“Msxml2.XMLHTTP”);
}
catch (e)
{
try{
http_request = new ActiveXObject(“Microsoft.XMLHTTP”);
}
catch (e) { }
}
}

If (! Http_request) / / exception, failed to create object instance
{
Alert (“cannot create XMLHttpRequest instance!!”);
return false;
}
//Specifies how the client handles when the server returns information
http_request.onreadystatechange = processRequest;
//< span twffan = “done” > determine the method and URL of sending the request and whether to execute the next code synchronously
http_request.open(“GET”,url,true);
http_request.send(null);
}
//******************************************************************
function processRequest()
{
If (http_request. ReadyState = = 4) / / judge the object state
{
If (http_request. Status = = 200) / / the request result has been returned successfully
{
alert(http_request.responseBody);
var a = document.getElementById(“hh”).innerText;
if (a ==”1″)
{
Alert (“unavailable!!”);
}
}
Else / / the page is abnormal
{
Alert (“the page you requested is abnormal”);
}
}
}
// ********************************************************************
function userCheck()
{
var f = document.Form1;
var userName = f.username.value;
if (userName == “”)
{
Alert (“user name cannot be empty!!”);
f.username.focus();
return false;
}
else
{
send_request(“alert.aspx?username=”+userName)
}
}