簡單的Ajax開發框架
發表于:2008-01-29來源:作者:點擊數:
標簽:開發
AJAX是一項綜合技術,AJAX的使用過程,首先是在HTML控件中添加相應的事件觸發屬性,使其具備事件觸發能力;其次是編寫事件處理函數,并在這個函數中初始化XMLHttpRequest對象,指定響應處理程序,創建http請求,設置必要的http請求頭信息,向 服務器 發送所創建的http
AJAX是一項綜合技術,AJAX的使用過程,首先是在HTML控件中添加相應的事件觸發屬性,使其具備事件觸發能力;其次是編寫事件處理函數,并在這個函數中初始化XMLHttpRequest對象,指定響應處理程序,創建http請求,設置必要的http請求頭信息,向
服務器發送所創建的http請求;最后才是創建響應處理函數,在對http請求狀態進行判斷的基礎上作出既定的業務處理事務。
(一)事件處理函數,按照以下順序處理下列事務:
a) 初始化XMLHttpRequest對象;
實現代碼如下:
if(widow.XMLHttpRequest) {//Mozilla,Safari,.......
http_request= new XMLHttpRequest();
} else if(window.ActiveXObject) {//IE
http_request= new ActiveXObject("Microsoft.XMLHTTP");
} else {
window.alert("瀏覽器沒有實現XMLHttpRequest 組件對象!");
}
b) 設置XMLHttpRequest對象的onreadystatechange 屬性,指定服務器返回響應數據時要調用的回調函數, 即指定響應處理函數;
實現代碼如下:
http_request.onreadystatechange=processRequest;
c) 調用XMLHttpRequest對象的open方法,創建http請求;
實現代碼如下:
http_request.open("GET", "http://www.example.org/some.file", true);
d) 調用XMLHttpRequest對象的setRequestHeader等方法,設置必要的http請求頭信息;
實現代碼如下:
http_request.setRequestHeader("Content-Type",application/x-www-form-urlencoded);
e) 調用XMLHttpRequest對象的send方法,發送之前創建的http請求;
實現代碼如下:
http_request.send(null);
f) 根據XMLHttpRequest對象的open方法參數,決定是否等待服務器返回響應數據.
(二)回調函數(響應處理函數)執行以下事務:
aa) 判斷http請求的狀態,并作相應處理;
bb) 調用XMLHttpRequest對象的responseXML or responseText方法,將服務器返回的響應數據賦予
JavaScript變量或對象;
clearcase/" target="_blank" >cc) 使用DOM或其它方式解析服務器返回的響應數據,保存在緩存變量或數組中;
dd) 使用DOM解析HTML文檔,定位目標HTML文檔節點;
ee) 使用解析完畢的服務器返回的響應數據,更新上一步解答分析HTML文檔節點的屬性值或內容,從而更新HTML文檔頁面內容.
原文轉自:http://www.kjueaiud.com