1.概念
Ajax是Asynchronous javaScript and xml的縮寫,就是異步Javascript與XML。
傳統(tǒng)WEB應(yīng)用中,頁面中用戶的每一次操作都將觸發(fā)一次返回Web服務(wù)器的HTTP請求,服務(wù)器進(jìn)行相應(yīng)處理后返回相應(yīng)的HEML頁面。而在Ajax應(yīng)用中,頁面中用戶的操作將通過Ajax
引擎與服務(wù)器端進(jìn)行通信,然后將返回結(jié)果提交給客戶端Ajax引擎,再由Ajax引擎來決定將這些數(shù)據(jù)插入到頁面的指定位置。

所以Ajax最大的特點(diǎn)就是無刷新的更新頁面,減輕了服務(wù)器的負(fù)擔(dān)。
2.Ajax技術(shù)
Ajax是JavaScript、XML、CSS、DOM等多種已有技術(shù)的組合。
2.1xmlhttpRequest
Ajax最核心的技術(shù)就是XMLHttPRequest,它是一個具有應(yīng)用程序接口的JavaScript對象,通過它,可以只同服務(wù)器進(jìn)行數(shù)據(jù)層面的交換,而不用每次都刷新頁面。
XMLHttpRequest對象的常用方法及常用屬性如下:

2.2JavaScript
在Web頁面中添加動態(tài)腳本代碼的解釋性程序語言。
2.3DOM
Document Object Model(文檔對象模型),是表示文檔和訪問、操作構(gòu)成文檔的各種元素(如HTML標(biāo)記和文本串)的應(yīng)用程序接口。在Ajax應(yīng)用中,通過JavaScript操作DOM,可以達(dá)到在不刷新頁面的情況下實(shí)時修改用戶界面的目的。
2.4XML
Extensible Markup Language(可擴(kuò)展的標(biāo)記語言),提供了用于描述結(jié)構(gòu)化數(shù)據(jù)的格式。
2.5CSS
層疊樣式表,用于頁面布局,通過改變文檔對象的CSS屬性控制頁面的外觀和行為。
3.傳統(tǒng)Ajax的工作流程
3.1發(fā)送請求
1)初始化XMLHttpRequest對象
使用XMLHttpRequest之前需要進(jìn)行初始化,初始化的方法如下:
if(window.XMLHttpRequest){    http_request=new XMLHttpRequest(); //非IE瀏覽器}else if(window.ActiveObject){    //IE瀏覽器    try{        http_request=new ActiveObject("Msxml2.XMLHTTP");    }    catch(e){        try{            http_request=new ActiveObject("Microsoft.XMLHTTP");        }        catch(e){}    }}2)為XMLHttpRequest對象指定一個回調(diào)函數(shù),用于對返回結(jié)果進(jìn)行處理。
http_request.onreadystatechange=getResult; //調(diào)用回調(diào)函數(shù)
如果要指定傳遞的參數(shù),可以應(yīng)用以下方法:
http_request.onreadystatechange=function(){getResult(param)};3)創(chuàng)建一個與服務(wù)器的連接,在創(chuàng)建時,需要指定發(fā)送請求的方式,以及設(shè)置是否采用異步方式發(fā)送請求
http_request.open("GET", url, true);// http_request.open("POST", url,true);4)向服務(wù)器發(fā)送請求。利用send()方法可以實(shí)現(xiàn)向服務(wù)器發(fā)送請求,該方法需要傳遞一個參數(shù),如果發(fā)送的是GET請求,可以將參數(shù)設(shè)置為null;如果發(fā)送的是POST請求,該方法需要通過該參數(shù)指定要發(fā)送的請求參數(shù)。
發(fā)送GET請求:
http_request.send(null);
發(fā)送POST請求:
http_request.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");var param="user="+......;//組合參數(shù)http_request.send(param);3.2處理服務(wù)器響應(yīng)
在指定的回調(diào)函數(shù)中,首先需要判斷服務(wù)器的請求狀態(tài),保證請求已完成,然后再根據(jù)服務(wù)器的HTTP狀態(tài)碼,判斷服務(wù)器對請求的響應(yīng)是否成功,如果成功,則獲取服務(wù)器的響應(yīng)反饋給客戶端。XMLHttpRequest對象提供了兩個用來訪問服務(wù)器響應(yīng)的屬性:一個是responseText屬性,返回字符串響應(yīng);另一個是responseXML屬性,返回XML響應(yīng)。
1)處理字符串響應(yīng)
function getResult(){    if(http_request.readyState==4){           //判斷請求狀態(tài)        if(http_request.status==200){         //請求成功,開始處理相應(yīng)            alert(http_request.responseText);  //彈出提示對話框顯示響應(yīng)結(jié)果        }else{            alert("錯誤");        }            }}2)處理XML響應(yīng)
var xmldoc=http_request.responseXML;
解析xmldoc
新聞熱點(diǎn)
疑難解答
圖片精選