Ajax详解

一、什么是ajax

ajax是 "Asynchronous Javascript And XML" （异步JavaScript和XML）缩写。

ajax不是一种语言，而是一种为了创建更好更快和交互性更强的一种web应用程序的技术。

它是一套综合了多项技术的客户端网页开发的技术。

这些技术包含了JavaScript、XHTML和CSS、DOM、XML和XMLHttpRequest。

二、ajax的原理

通过浏览器的XMLHttpRequest（ajax引擎）对象，来向服务器（发送异步请求）并（接收服务器）的响应数据，然后用JavaScript来操作DOM，实现动态局部刷新。

三、ajax实现的四个步骤

1、创建ajax引擎对象

XMLHttpRequest对象，目前所有浏览器都支持XMLHttpRequest对象，（IE5和IE6使用ActiveXObject），代码做兼容处理。

var XHR;
if (window.XMLHttpRequest) {
   // 支持所有浏览器
   XHR = new XMLHttpRequest();
} else {
   // 支持老版本的IE浏览器
   XHR = new ActiveXObject("Microsoft.XMLHttp");
}

2、设置响应函数 ，当readyState的值改变时自动触发执行函数

   readyState 状态值（整数），可以确定请求/响应过程的当前活动阶段

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

XHR.onreadystatechange = fucntion () {
   if (this.readyState !== 4) {
        return ;
   }  
   if (XHR === 200) {
       console.log(this.response)    
   }
};

3、使用OPEN方法与服务器建立连接

XHR.open("get", url, true);

此步骤注意设置http的请求方式（post/get），如果是post方式，注意请求头信息XHR.setRequestHeader("Content-Type","application/x-www-form-urlencoded")

4、向服务器端发送数据

XHR.send();

如果是post方式就不为空。

本文属于转载，更为详细介绍查看 《Ajax详解》