AJAX的四步操作

1、第一步，得到XMLHttpRequest对象

• ajax需要掌握XMLHttpRequest对象。获取方式：

  • 大多数浏览器都支持 ：var xmlHttp = new XMLHttpRequest();
  • IE6.0 ： var xmlHttp = new ActiveXObject(“Msxml2.XMLHTTP”);
  • IE5.5及更早版本：var xmlHttp = new ActiveXObject(“Microsoft.XMLHTTP”);

• 创建对象的函数

function creatXMLHttpRequest() {
    try {
        return new XMLHttpRequest();
    } catch(e) {
        try {
        	return new ActiveXObject("Msxml2.XMLHTTP");
    	} catch(e) {
        	try {
        		return new ActiveXObject("Microsoft.XMLHTTP");
    		} catch(e) {
        		throw e;
    		}
    	}
    }
};

2、第二步，打开服务器的连接

• xmlHttp.open(); 用来打开与服务器的连接，需要三个参数；

  • 请求方式，GET或者POST
  • 请求的URL
  • 请求是否为一步，true或者false

• xmlHttp.open(“GET”,URL,true);

3、第三步，发送请求

• xmlHttp.send(null)；如果不给，可能会造成部分浏览器无法发送。（GET请求没有请求体）
• 参数：就是请求体内容，如果是GET请求，必须给出null

4、第四步，监听数据

• 在xmlHttp对象的一个事件上注册监听器：onreadystatechange

• xmlHttp对象一共有五个状态：

  • 0状态：刚创建xmlHttpRequest对象，还没有调用open()方法；
  • 1状态：请求开始，刚调用了open()方法
  • 2状态：刚调用完send()方法
  • 3状态：服务器开始了响应，但不表示响应结束了
  • 4状态：服务器响应结束（通常只关心这个状态）

• 得到xmlHttp对象的状态：

  • var state = xmlHttp.readyState; //可能是0、1、2、3、4

• 得到服务器响应的状态码

  • var status = xmlHttp.status； //可能是200、404、500

• 得到服务器响应的内容

  • var content = xmlHttp.responseText； 得到服务器响应的文本格式的内容
  • var content = xmlHttp.responseXML；得到服务器响应的xml格式的内容，是一个document

xmlHttp.onreadystatechange = function() {
    //双重判断
    if (xmlHttp.readyState == 4 && xmlHttp.status == 200) {
        var text = xmlHttp.responseText;
    }
};