AJAX的工作流程有哪些？ajax的工作流程介紹（附執行個體）

本篇文章主要講述了關於ajax的工作流程情況，還有ajax原理，一些常用的屬性介紹，現在讓我們一起來看這篇文章吧

AJAX全稱為"Asynchronous JavaScript and XML"（非同步JavaScript和XML）。

是一種建立互動式網頁應用的網頁開發技術。它：
使用XHTML+CSS來表示資訊；
使用JavaScript操作DOM（Document Object Model）進行動態顯示及互動；
使用XML和XSLT進行資料交換及相關操作；
使用XMLHttpRequest對象與Web伺服器進行非同步資料交換；
使用JavaScript將所有的東西綁定在一起。
AJAX原理:
AJAX不是指一種單一的技術，而是有機地利用了一系列相關的技術。它的核心是JavaScript對象XmlHttpRequest，這個對象使我們可以使用JavaScript向伺服器提出請求並處理響應，而不阻塞使用者。AJAX採用非同步互動過程，它在使用者與伺服器之間引入一個中間媒介，從而消除了網路互動過程中的處理—等待—處理—等待缺點。使用者的瀏覽器在執行任務時即裝載了AJAX引擎，AJAX引擎用JavaScript語言編寫，通常藏在一個隱藏的架構中。它負責編譯使用者介面及與伺服器之間的互動。AJAX引擎允許使用者與應用軟體之間的互動過程非同步進行，獨立於使用者與網路伺服器間的交流。現在，可以用Javascript調用AJAX引擎來代替產生一個HTTP的使用者動作，記憶體中的資料編輯、頁面導航、資料校正這些不需要重新載入整個頁面的需求可以交給AJAX來執行，使用AJAX，可以為JSP、開發人員、終端使用者帶來可見的便捷。
既然Ajax的核心是XmlHttpRequest對象那就必須得介紹一下：
常用屬性：
Onreadystatechange 指定當readyState屬性改變時的事件處理函數。唯寫
readyState 表示Ajax請求的目前狀態。唯讀它的值用數字代表。
0 代表未初始化。 還沒有調用 open 方法
1 代表正在載入。 open 方法已被調用，但 send 方法還沒有被調用
2 代表已載入完畢。send 已被調用。請求已經開始
3 代表互動中。伺服器正在發送響應
4 代表完成。響應發送完畢
每次 readyState 值的改變，都會觸發 readystatechange 事件。
responseText 將響應資訊作為字串返回.唯讀。它是一個HTML,XML或普通文本，這取決於伺服器發送的內容。當 readyState 屬性值變成 4 時, responseText 屬性才可用，表明 Ajax 請求已經結束。
responseXML 將響應資訊格式化為Xml Document對象並返回，唯讀，只有伺服器發送了帶有正確首部資訊的資料時， responseXML 屬性才是可用的。 MIME 類型必須為 text/xml
status 返回當前請求的http狀態代碼.唯讀
常用狀態代碼及其含義：
404 沒找到頁面(not found)
403 禁止訪問(forbidden)
500 內部伺服器出錯(internal service error)
200 一切正常(ok)
304 沒有被修改(not modified)(伺服器返回304狀態，表示源檔案沒有被修改 )
在 XMLHttpRequest 對象中，伺服器發送的狀態代碼都儲存在 status 屬性裡。通過把這個值和 200 或 304 比較，可以確保伺服器是否已發送了一個成功的響應（想看更多就到topic.alibabacloud.comAJAX開發手冊欄目中學習）

常用方法：
Open 建立一個新的http請求，並指定此請求的方法、URL以及驗證資訊
Send 發送請求到http伺服器並接收回應 如果請求為get不會發送任何資料
setRequestHeader 單獨指定請求的某個http頭
AJAX工作流程:
1 對象初始化

function   createXmlHttpRequest(){   var xmlHttp;   try{    //Firefox, Opera 8.0+, Safari           xmlHttp=new XMLHttpRequest();    }catch (e){           try{    //Internet Explorer                  xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");            }catch (e){                  try{                   xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");                  }catch (e){}             }    }   return xmlHttp; }

2 發送請求
調用XMLHttpRequest對象的open和send方法，按照順序，open調用完畢之後才調用send方法。

xmlHttp.open("get","../servlet/RegisterServlet?timeStamp="+new Date().getTime(),true)xmlHttp.send(null);

send的參數如果是以Post方式發出的話，可以是任何想傳給伺服器的內容，但必須先調用setRequestHeader方法，修改MIME類別：
xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
3 伺服器接收處理資料並返回，指定事件處理常式處理返回資訊
每次 readyState 屬性的改變都會觸發 readystatechange 事件只要將相應的處理函數名稱賦給XMLHttpRequest對象的onreadystatechange屬性就可以了

 xmlHttp.onreadystatechange = function(){            if (xmlHttp.readystate == 4) {   if (xmlHttp.status == 200 || xmlHttp.status == 304) {//XMLHttpRequest對成功返回的資訊有兩種處理方式：//responseText：  將傳回的資訊當字串使用；//responseXML：將傳回的資訊當XML文檔使用，可以用DOM處理。         }            }        };

4 用戶端接收
5 修改用戶端頁面內容

本篇文章到這就結束了（想看更多就到topic.alibabacloud.comAJAX使用手冊欄目中學習），有問題的可以在下方留言提問。