AJAX的工作流程如下圖：

?

#1. 發(fā)生某個(gè)事件：一般為oclick事件、onchange事件、onkeyup事件等

註：

#oclick事件：在物件被點(diǎn)擊時(shí)發(fā)生

onchange事件：在網(wǎng)域的內(nèi)容改變時(shí)發(fā)生

onkeyup事件：在鍵盤按鍵被放開時(shí)發(fā)生

2.?建立XMLHttpRequest物件

由於瀏覽器版本差異，所以建立時(shí)需要做一個(gè)常規(guī)判斷，具體程式碼如下

var xmlhttp;
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }

#3.?發(fā)送HttpRequest

使用XMLHttpRequest 物件的open() 和send() 方法將請(qǐng)求傳送至伺服器

    xmlhttp.open("GET","test1.txt",true);
    xmlhttp.send();

註：注意請(qǐng)求的格式，具體格式如下

4.?處理HTTPRequest,建立回應(yīng)並將資料暑假回傳瀏覽器

• 當(dāng)請(qǐng)求被傳送到伺服器時(shí)，我們需要執(zhí)行一些基於回應(yīng)的任務(wù)。

每當(dāng) readyState 改變時(shí)，就會(huì)觸發(fā) onreadystatechange 事件。

readyState 屬性存有 XMLHttpRequest 的狀態(tài)資訊。

XMLHttpRequest 物件的三個(gè)重要的屬性如下：

在onreadystatechange 事件中，我們規(guī)定當(dāng)伺服器回應(yīng)已做好被處理的準(zhǔn)備時(shí)所執(zhí)行的任務(wù)。

當(dāng)。 readyState 等於4?? 且狀態(tài)為200 時(shí)，表示回應(yīng)已就緒

註：onreadystatechange 事件被觸發(fā)5 次（0 - 4），對(duì)應(yīng)readyState 的每個(gè)變更

• ?想要取得伺服器的回應(yīng)，則可以使用XMLHttpRequest 物件的responseText 或responseXML 屬性。

範(fàn)例：

xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
    }
  }

5.?使用js處理被傳回的數(shù)據(jù)，更新頁(yè)面

js透過id取得表單的一部分區(qū)域，將XMLHttpRequest 物件傳回的資料填入上去。