Tag: State change style text script size star POS Request Object
One: Using XMLHttpRequest objects
The core of Ajax is the XMLHttpRequest object. IE7 The following browser XHR definition methods are different. For the higher-level browser var xhr = new XMLHttpRequest ().
var xhr new XMLHttpRequest (); Xhr.open () xhr.send (null)
The Xhr.open receives three parameters, the first of which is the Send mode get or post. The second parameter is the URL, and the third parameter is the Boolean value, whether it is asynchronous.
Xhr.send (NULL), the parameter is the data sent to the server, and if not, must be written null.
The browser's response data is used as the Xhr property: Respensetext,responsexml,status,statustext. A status of 200 indicates success, and a status of 304 indicates that the content has not been modified and can be used directly from the cache.
2) under an asynchronous request, the Xhr property readystate, representing the current active state, equals 4, indicates success, and whenever the state changes, the onreadystatechange () event is called, and the definition of the event must precede the Xhr.open function.
Xhr.abort () canceling an asynchronous request
3) Set and get header information for HTTP requests
Set by Method Xhr.setrequestheader (the name of the header field name, the value to be set).
Get header information for the response: Xhr.getresponseheader (header field name), getAllResponseHeaders () Get All header information
4) Get request--url string encoding problem
Each string in the URL must be encoded using encodeurlcomponent (), such as Example.php?name1=value1&name2=value2
5) Post request
Send data to the server, Xhr.send. The FormData object, which defines the sent form object, var data = new FormData (), Data.append (Key,value), FormData object is present in the XHR2 level.
6) Timeout time-out setting
Xhr.timeout = 1000hs. OnTimeOut event is triggered when timeout, xhr.ontimeout = function () {}
varXHR =NewXMLHttpRequest (); Xhr.onreadystatechange=function(){ if(Xhr.readystate = = 4) { Try{ if((xhr.statue>=200 && xhr.status<=300) | | xhr.status==304) {Xhr.responsetext}}Catch(ex) {//Suppose there are ontimeout processing events}}}xhr.open (); Xhr.timeout= 1000; Xhr.ontimeout=function() {}xhr.send (NULL)
Two: Using the XMLHttpRequest Event
Progress Event: The following 6 progress events are available. Loadstart,progress, error, Abort, load, loadend.
1) Use Load event optimization:
var xhr newfunction() { try{ if ((xhr.statue>=200 && xhr.status<=300) | | xhr.status==304) {xhr.responsetext}} catch(ex) {// Suppose there is a ontimeout processing event} =thefunction() {}xhr.send (null )
Whenever the browser receives a server response, the load event is triggered regardless of the state, so the status must be checked.
2) Create a progress bar using the Progress event
The OnProgress event receives an events object that has a property target, points to the Xhr object, and also includes a Lengthcomputabel (Boolean indicating availability), totalsize, position.
Three: Limitations of cross-domain AJAX communication
CORS (cross-domain resource sharing), the basic idea is to customize the HTTP header information to allow the browser to communicate with the server, so as to determine whether the request is successful or failed.
Javascript:ajax and Comet