Javascript: XMLHttpRequest对象

本文介绍Request对象所具有的属性。这些属性在大多数浏览器中已经获得了支持。包括IE5.0以及后续版本、Safari1.3和2.0、Netscape7和Opera较高级版本（如：Opera8.5）。Mozilla Firefox的Request对象还具有更多的属性和方法，

 

对象的属性  

• onreadystatechange：回调函数，只要readyState发生变化，被赋给这个属性的函数就会被调用
• readyState：数值。0表示未初始化，open()函数还没有被调用；1表示正在载入，send()函数还没有被调用；2表示已经载入，并且header/status已经可用；3表示正在交互，responseText已经含有部分数据；4表示已经完成。
• responseText：字符串，响应的纯文本
• responseXML：DOM文档对象最为返回值的XML
• status：响应状态代码，比如200（OK）或404（未找到）
• statusText：字符串，与HTTP响应状态相关的文本

对象的方法

• abort()：void，取消HTTP请求
• getAllResponseHeaders()：字符串，以预定义的格式字符串形式返回所有的响应首部
• getResponseHeader(string header)：字符串，返回某个特定首部的值
• open(string reqType, string url, string asynch)：void，准备HTTP请求，并指明它是否为异步
• send(string)：void，发送HTTP请求
• setRequestHeader(string header, string value)：void，设置请求首部，但必须先调用open()函数。

对象的创建

 

在Firefox和Netscap还有Safari和Opera中，这个对象被命名为XMLHttpRequest。
但是，在IE中，则被称之为Microsof.XMLHTTP或者Msxml2.XMLHTTP。
检测浏览器的兼容性的代码如下：

if(window.XMLHttpRequest){ request=new XMLHttpRequest(); }else if(window.ActiveXObject){ request=new ActiveXObject("Microsoft.XMLHTTP"); if(!request){ request=new ActiveXObject("Msxml2.XMLHTTP"); } }
XMLHttpRequest对象建立之后，就可以与服务器进行通信了。

 

执行HTTP请求类型如GET或者POST

• GET HTTP请求的代码如下：
  request.onreadystatechange=handleResponse; request.open("GET","http://www.pihizi.com.cn",true); request.send(null);
• POST HTTP请求的代码如下：
  

  request.onreadystatechange=handleResponse; request.open("POST","http://www.pihizi.com.cn",true); request.setRequestHeader("Content-Type","application/x-www-form-urlencoded;charset=utf-8");//因为大多数情况下，服务器期望从POST请求中获取首部。 request.send("name=pihizi&contry=China");

   

处理XMLHttpRequest对象的错误

function handleResponse(){ try{ if(request.readyState==4){ if(request.status==200){ //服务器端没有错误执行的代码 }else{ //服务器端有错误的错误提示 } }catch(err){//服务器端没有响应首部，status属性没有任何数据的错误提示信息} }

 

Ajax利用JSON(JavaScript Object Notation)格式获取数据  

 

下面是一个完整的JSON格式：

{firstName:"pi",lastName:"hi",country:"China"}

XMLHttpRequest 处理返回的JSON格式数据

 

function handleResponse(){ if(request.readyState==4){ if(request.status==200){ var resp=request.responseText; var func=new Function("return "+resp); var objC=func; response.write(objC.firstName+" "+objC.lastName+" "+objC.country); } } }