Ajax原理

Ajax：Asynchronous JavaScript and XML 异步的Javascript和XML

Ajax可以通过XMLHttpRequest对象与服务器进行交互，实现在不刷新整个网页的情况下，获取数据，再通过javascript脚本操作DOM将数据变化插入到网页中，达到网页部分内容更新的效果。

Ajax创建对象及属性和方法

创建异步调用对象XMLHttpRequest

var xmlHttp=null;
if(window.XMLHttpRequest)
{  
    xhr = new XMLHttpRequest(); //IE7以上及其他常见浏览器
}
else
{
    xhr = new ActiveXObject("Microsoft.XMLHTTP");//IE6、IE5
}

• 当考虑兼容问题，IE6及以下不支持XMLHttpRequest对象，可以使用ActiveObject(“Microsoft.XMLHHTP”)创建异步调用的对象
• null值表示一个空对象指针，使用typeof操作符检测null值会返回“object”，所以当定义的变量准备在将来用于保存对象，那么最好将该变量初始化为null而不是其他值

XHR对象的属性和方法

• open方法： 规定请求的类型、URL 以及是否异步处理请求。对应三个参数

  • method：请求的方法
  • url：文件在服务器上的位置
  • async：true（异步）或 false（同步）

• send方法：将请求发送到服务器（仅用于 POST 请求）

注：如果不需要通过请求主体发送数据，则必须传入null。一般get请求不需要传入参数，

而对于post请求，如果需要像 HTML 表单那样 POST 数据，需使用 setRequestHeader() 来添加 HTTP 头

。然后在 send() 方法中规定希望发送的数据。

通过send()发送之后，会接受到响应，响应的数据会自动填充XHR对象的属性。

• responseText：作为响应主体被返回的文本
• responseXML：如果响应的内容类型是”text/xml”或”application/xml”,这个属性中将保存包含着相应数据的XML DOM文档。
• status：响应的http状态
• statusText：Http状态的说明

接收到响应后，一般是先检查status，来确定响应是否成功返回，状态代码200表示成功（以2开头即表示成功），这是responseText就可以被访问了。而

状态代码为304表示请求的资源并没有被修改，可以直接使用浏览器中缓存的版本

，因此这种响应也是有效的。

• readyState
  
  存有 XMLHttpRequest 的状态，检测请求/响应过程的当前活动阶段从 0 到 4 发生变化