AJAX的工作流程有哪些？ ajax的工作流程介紹（附實例）

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

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

#

是一種創建互動式網頁應用程式的網頁開發技術。它：
     使用XHTML CSS來表示訊息；
     使用JavaScript操作DOM（Document Object Model）進行動態顯示及互動；
     使用XML和XSLT進行資料物件交換及相關作業；
     使用XML和XSLT進行資料物件交換及相關作業；
     使用XML和XSLT進行資料物件交換及相關操作；## 與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狀態碼.唯讀
              ound)
               403 禁止使用(forbidden)
               00 一切正常(ok)
               304 沒有被修改(not modified)(伺服器返回304狀態，表示來源檔案沒有被修改)
     在XMLHttpRequest 物件中，伺服器傳送的狀態碼都保存在status 屬性裡。透過把這個值和 200 或 304 比較，可以確保伺服器是否已發送了一個成功的回應
（想看更多就到PHP中文網AJAX開發手冊欄位中學習）

常用方法：
     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 修改用戶端頁面內容

這篇文章到這就結束了（想看更多就到PHP中文網AJAX使用手冊欄位學習），有問題的可以在下方留言提問。

以上是AJAX的工作流程有哪些？ ajax的工作流程介紹（附實例）的詳細內容。更多資訊請關注PHP中文網其他相關文章！