XMLHttpRequest 对象与属性

来源：互联网发布：喷淋塔计算软件编辑：程序博客网时间：2024/05/16 04:53

　　XMLHttpRequest 对象用于在后台与服务器交换数据。

小例子

 1 //初始化XMLHttpRequest对象 2  var xhr=null; 3 var textName=null; 4 var infoTag=null; 5  //创建XmlHttpRequest对象并返回 6  function CreateXMLHttpRequest(){ 7     var xmlHttp; 8     if(window.XMLHttpRequest){ 9         xmlHttp=new XMLHttpRequest();10     } 11     else if(window.ActiveXObject){12         xmlHttp=new ActiveXObject('Microsoft.XMLHTTP');13     }14     return xmlHttp;15 }16  //异步检查用户名是否存在17 function Check(){18     textName=document.getElementById('user');19     infoTag=document.getElementById('info');20     var sendData='userName='+textName.value;21     if(textName.value!=""){22         xhr=CreateXMLHttpRequest();23         xhr.onreadystatechange=CallBack_ShowData; 24         xhr.open('Post','Server_php/ServerCheck.php',true);25         //post方式需要下面两句设置Header26         xhr.setRequestHeader("content-length",sendData.length);27         xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded"); 28         //要POST的数据        29         xhr.send(sendData);30     }31     else{32        infoTag.innerHTML='请输入用户名';33     }34 }35 function CallBack_ShowData(){36     if(xhr.readyState == 4){37     if(xhr.status==200){38         var data=xhr.responseText;39         //如果用户名存在则清空user，并使其获得焦点40         if(data.split('|')[1]=='Error'){41             textName.value='';42             textName.focus();                    43         }44         //不存在则让下一输入框获得焦点45         else{46             infoTag.focus();47         }48         //显示异步传输过来的数据49         infoTag.innerHTML=data.split('|')[0];50     }51     }52 }

方法属性open()onreadystatechangesetRequestHeader()statussend()readyStategetResponseHeader()statusTextgetAllResponseHeaders()responseText responseXML responseBody responseStream

open初始化HTTP请求参数,语法(method, url, async, username, password)|method指定请求方式,一般是[GET、POST]不区分大小写; url指定请求地址,大多数浏览器都限制在同域下[要求url与请求页面具有相同的主机名和端口],可以为绝对地址也可以为相对地址; async指定请求是异步还是同步,默认是异步[true]则通常许指定一个onreadystatechange句柄[用于异步回调],同步则指定为[false]; username 和 password 参数是可选的[及在请求的url需要授权时填写];

setRequestHeader单独指定请求的某个http头,语法(headerStr,valueStr)|headerStr指定头名称,如果存在则覆盖 valueStr指定值[此方法必须在open方法后调用]

send发送请求到http服务器并接收回应,语法(varBody)|指定请求中发送的数据;此方法的同步或异步方式取决于open方法中的async参数,如果async == False,此方法将会等待请求完成或者超时时才会返回;如果async == True，此方法将立即返回。

getAllResponseHeaders获取响应的所有http头,语法()|每个http头名称和值用冒号分割，并以\r\n结束。当send方法完成后才可调用该方法。

getResponseHeader从响应信息中获取指定的http头,语法(headerStr)|headerStr指定头名称,当send方法成功后才可调用该方法;

onreadystatechange当readyState属性改变时调用该属性指定的方法

status2**：操作成功收到，分析、接受[200常用] |4**：客户端请求错误 |5**：服务器响应错误

statusTextstatusText属性和status属性的功能基本相同．他们的区别在于status返回的是http状态码[数字形式]; 而statusText返回的是以文本形式返回http状态信息.比如在请求一个不存在的网页时status返回404, 而statusText则返回Not Found

readyState0未初始化还没有调用send()方法1载入已调用send()方法，正在发送请求2载入完成send()方法执行完成，已经接收到全部响应内容3交互正在解析响应内容4完成响应内容解析完成，可以在客户端调用了

responseText_responseXML_responseBody_responseStreamresponseText将响应信息作为字符串返回;XMLHTTP默认将响应数据的编码定为UTF-8;responseXML将响应信息格式化为Xml Document对象并返回;如果响应数据不是有效的XML文档，此属性本身不返回XMLDOMParseError，可以通过处理过的DOMDocument对象获取错误信息responseBody以unsigned array格式表示直接从服务器返回的未经解码的二进制数据responseStream以Ado Stream对象的形式返回响应信息

最后还有一个abort方法，用于取消当前请求.