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;
    }
};