Ajax的全称为Asynchronous JavaScript And Xml，是一种web客户端与服务器端异步通信的技术。
异步的直观表现就是：当前页面发送一个请求给服务器，当前页面不需要等待服务器响应也可以继续操作网页。
XMLHttpRequest对象
1、创建xhr对象
代码语言：javascript复制var xhr = new XMLHttpRequest();2、发送请求
代码语言：javascript复制xhr.open("get","example.php",false);
xhr.send(null);open方法接受三个参数：要发送的请求类型(常用的有get和post)，请求的url和表示是否异步的布尔值。send()方法接受一个参数，即要作为请求主体发送的数据。但是 不需要通过请求主体发送数据时，必须给send()方法传入 null 。
3、异步请求 多数情况下，我们是需要发送异步请求，JavaScript可以继续执行而不必等待响应。这时，可以检测XHR对象的readyState属性，它有以下几个可能的值：
- 0：未初始化。尚未调用open()
- 1: 启动。已调用open()，未调用send()
- 2: 发送。已调用send()，为未收到响应
- 3：接受。已接受到部分数据
- 4：完成。已接受全部数据
readyState的值每次变化都会触发一次readystatechange事件。通常，我们只对最后一个状态感兴趣，只要readyState变为4，我们就可以开始处理响应了。因此可以这样写代码：
代码语言：javascript复制var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function (){
if(xhr.readyState == 4){
//处理
}
};
xhr.open("get","example.php",true);
xhr.send(null);因为调用open方法时也会触发readystatechange事件，所以 在调用open前就要注册eadystatechange事件 。
4 、异步请求 在收到响应后，响应的数据会自动填充xhr对象的相关属性，因此我们只需判断处理这些属性即可。相关属性如下：
- responseText：作为响应被返回的主体
- responseXML：如果响应的类型是”text/xml”或”application/xml”，这个属性将保存着响应的xml文档
- status：响应的http状态
- statusText：http状态的说明
收到响应后，我们首先应根据http的状态判断是否成功，一般状态码status = 200,被是做成功状态码为304表示内容未被修改，可使用本地缓存。可像下面这样检测这两种状态码：
代码语言：javascript复制var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function (){
if(xhr.readyState == 4){
if((xhr.status >= 200 && xhr.status < 300) || xhr.status == 304){
//响应成功返回
}else{
console.log("Request was unsuccessful " xhr.status);
}
}
};
xhr.open("get","example.php",true);
xhr.send(null);在接收到响应之前还可以调用abort()方法来取消异步操作：
代码语言：javascript复制xhr.abort()Ajax 的缺点就目前来看，主要是破坏了浏览器的前进和后退功能。在浏览器日趋强大的的今天，兼容性问题其实不是特别大了。
