XMLHttpRequest对象_详细介绍

原理：

通过XMLHttpRequest对象来向服务器发异步请求，从服务器获得数据，然后用javascript来操作DOM而更新页面。本质是js和服务器端交互。

创建：

相对于浏览器来说，分为俩种方式：
1.IE：
　　其中IE相对于不同的版本又分为3种方式：
　　(1).IE5.0:   var xhr=new ActiveXObject("Microsoft.XMLHTTP");
      (2).IE6.0:   var xhr=new ActiveXObject("Msxml2.XMLHTTP");
      (3).IE7.0以上： var xhr=new XMLHttpRequest();　　//从7.0以上，向标准看齐

2.非IE： 
      var xhr=new XMLHttpRequest(); //IE7.0与此一样
  eg：

 

function newXMLHttpRequest()
{
　　var xmlreq = false;
　　// Create XMLHttpRequest object in non-Microsoft browsers
　　if (window.XMLHttpRequest)　　
　　{　　
　　　　xmlreq = new XMLHttpRequest();
　　}
　　else if (window.ActiveXObject)
　　{
　　　　try
　　　　{
　　　　　　// Try to create XMLHttpRequest in later versions of Internet Explorer (ie6.0)
　　　　　　xmlreq = new ActiveXObject("Msxml2.XMLHTTP");
　　　　}
　　　　catch (e1)
　　　　{
　　　　　　// Failed to create required ActiveXObject
　　　　　　try
　　　　　　{
　　　　　　　　// Try version supported by older versions of Internet Explorer (ie5.0)
　　　　　　　　xmlreq = new ActiveXObject("Microsoft.XMLHTTP");
　　　　　　}
　　　　　　catch (e2)
　　　　　　{
　　　　　　　　// Unable to create an XMLHttpRequest by any means
　　　　　　　　xmlreq = false;
　　　　　　}
　　　　}
　　}
　　return xmlreq;
}

【方法】：

XMLHttpRequest对象提供了各种方法用于初始化和处理HTTP请求，下列将逐个展开详细讨论。

abort()

取消与一个XMLHttpRequest对象相联系的HTTP请求，从而把该对象复位到未初始化状态。 

open()
初始化一个XMLHttpRequest对象.

open(String method，String url，boolean async，String username，String password)

method:是必须提供的,用于指定发送请求的HTTP方法(GET，POST，PUT，DELETE或HEAD).其中，POST：向服务器发送数据。GET：从服务器检索数据。
url:请求的url地址和传递的参数。
async：指定是否请求是异步的。true:异步，false:同步。默认值是true。
username,password:对于要求认证的服务器，你可以提供可选的用户名和口令参数。

在调用open()方法后，XMLHttpRequest对象把它的readyState属性设置为1(打开)并且把responseText、responseXML、status和statusText属性复位到它们的初始值。另外，它还复位请求头部。注意，如果你调用open()方法并且此时readyState为4，则XMLHttpRequest对象将复位这些值。 

send()
向服务器发送http请求。
send(content) content是可选的。可以显式地使用null参数，这与不用参数一样。对于大多数其它的数据类型，在调用send()方法之前，应该使用setRequestHeader()方法先设置Content-Type头部。
 

setRequestHeader()
setRequestHeader(DOMString header，DOMString value)设置请求的头部信息。

这个方法只有当readyState为1时，才能调用，即调用open之后，send之前。
如果open使用POST，则必须调用setRequestHeader方法设置content-type，setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); 

去掉缓存：

xhr.setRequestHeader('If-Modified-Since', 'Thu, 1 Jan 1970 00:00:00 GMT');

setRequestHeader('Cache-Control', 'no-cache');

getResponseHeader()

getResponseHeader(DOMString header)从响应信息中获取指定的http头信息。

getAllResponseHeaders()

以一个字符串形式返回所有的响应头信息。

 

【属性】：

readyState

当XMLHttpRequest对象把一个HTTP请求发送到服务器时将经历若干种状态：一直等待直到请求被处理；然后，它才接收一个响应。这样以来，脚本才正确响应各种状态，XMLHttpRequest对象有一个描述对象的当前状态的readyState属性。

0  描述一种"未初始化"状态； 
1  描述一种"发送"状态；
2  描述一种""状态； 
3  描述一种"正在接收"状态；此时，已经接收到HTTP响应头部信息，但是消息体部分还没有完全接收结束。 
4  描述一种"已加载"状态；此时，响应已经被完全接收。 

ReadyState取值	描述	备注
0	未初始化	此时，已经创建一个XMLHttpRequest对象，但是还没有初始化，尚未调用open方法。
1	初始化	此时，代码已经调用了open()方法并且XMLHttpRequest已经准备好把一个请求发送到服务器，尚未调用send方法。
2	发送	此时，已经通过send()方法把一个请求发送到服务器端，但是还没有收到一个响应。
3	正在接收	此时，已经接收到HTTP响应头部信息，但是消息体部分还没有完全接收结束。
4	完成加载	此时，响应已经被完全接收(数据接收完毕),此时可以通过通过responseXml和responseText获取完整的回应数据。

status
这个status属性描述了HTTP状态代码，而且其类型为short。比如常见的404（未找到）和200（已就绪）。而且，仅当readyState值为3(正在接收中)或4(已加载)时，这个status属性才可用。当readyState的值小于3时试图存取status的值将引发一个异常。

statusText
这个statusText属性描述了HTTP状态代码文本，是status的文本信息。

responseText
以字符串的形式返回服务器响应信息。当readyState值为0、1或2时，responseText包含一个空字符串。当readyState值为3(正在接收)时，响应中包含客户端还未完成的响应信息。当readyState为4(已加载)时，该responseText包含完整的响应信息。

responseXML
将响应信息格式化为XML Document对象返回；此时，Content-Type头部指定MIME(媒体)类型为text/xml，application/xml或以+xml结尾。如果Content-Type头部并不包含这些媒体类型之一，那么responseXML的值为null。无论何时，只要readyState值不为4，那么该responseXML的值也为null。
其实，这个responseXML属性值是一个文档接口类型的对象，用来描述被分析的文档。如果文档不能被分析(例如，如果文档不是良构的或不支持文档相应的字符编码)，那么responseXML的值将为null。 

 responseBody
将回应信息正文以unsigned byte 数组形式返回。

 

【事件】

onreadystatechange

无论readyState值何时发生改变，XMLHttpRequest对象都会激发一个readystatechange事件。