Ajax

1、Ajax 简介

  Ajax (Asynchronous JavaScript And XML，异步 JavaScript 和 XML)。通过 Ajax 可以向服务器发送请求，在不阻塞页面的情况下进行数据交互，也可以理解为异步数据传输。使用 Ajax 可以实现局部刷新，减少了不必要的数据量，大大提高了用户的体验，缩短了用户的等待的时间，使得 web 应用程序更小，更快，跟友好。

    var xhr;
    if(window.XMLHttpRequest){ // 新建 XMLHttpRequest 对象
        xhr = new XMLHttpRequest();
    } else if(window.ActiveXObject){ // 兼容 IE7 以下
        xhr = new ActiveXObject("Microsoft.XMLHTTP");
    }            
    xhr.onreadystatechange = function(){ // 状态发生变化时，函数被回调
            if(xhr.readyState == 4){ // 成功完成
                if(xhr.status >= 200){ // 判断响应结果
                    // 数据请求成功处理
                }
            }
    }
    xhr.open('get','./json',true);  // 初始化请求    
    xhr.send(); // 发生请求   

2、XMLHttpRequest 对象

（1）open 方法
  open 方法表示初始化请求，并不是发送请求。

open(method, url, async);

- method ：请求方式，get 或 post ，默认为 get
- URL ：请求路径，文件在服务器上的位置
- async ：是否异步请求，默认为 true，异步请求。 false 同步请求

（2）readyState 属性
  readyState 属性表示请求/响应过程的当前活动阶段。

• 0 ： 未初始化。尚未调用 open 方法
• 1 ： 启动。已经调用 open 方法，但尚未调用 send 方法
• 2 ： 发送。已经调用 send 方法，当尚未接收到响应
• 3 ： 接收。已经接收到部分响应数据。
• 4 ： 完成。已经接收到全部响应数据，而且已经可以在客户端使用了。

  只要 readyState 属性的值由一个值变成另一个值。都会触发一次 readystatechange 事件。可以利用这个事件来检测每次状态变化后 readyState 的值。通常，我们只处理 readyState 值为 4 时的状态。不过，必须在调用 open 方法之前指定 onreadystatechange 事件处理程序才能确保跨浏览器兼容。

（3）responseText
  responseText 属性是作为响应主体被返回的文本。如果 readyState 小于 3 ，这个属性就是一个空字符串，当 readyState 为 3 ，这个属性返回目前已经接收的响应部分。如果 readyState 为 4 ， 这个属性保存了完整的响应体。

（4）responseXML
  responseXML 如果响应的内容类型是 “text/xml” 或 “application/xml”。这个属性中将保存包含响应数据的 XML DOM 文档。

（5）status
  status 响应的 HTTP 状态。当 readyState 小于 3 的时候读取这一属性会导致一个异常。

• 1xx ： 表示通知信息， 如请求收到了或正在进行处理
• 2xx ： 表示成功， 如接受或知道了
• 3xx ： 表示重定向， 如要完成请求还必须采用进一步的行动
• 4xx ： 表示客户端的差错， 如请求中有错误的语法或不能完成
• 5xx ： 表示服务器端的错误， 如服务器失效无法完成请求

常见的 HTTP 状态有：200 表示成功；202 表示接受；400 错误的请求； 404 找不到； 301 永久性的转移了。