ajax原理和XmlHttpRequest對象
Ajax的原理簡單來說通過XmlHttpRequest對象來向服務(wù)器發(fā)異步請求，從服務(wù)器獲得數(shù)據(jù)，然后用javascript來操作DOM而更新頁面。這其中最關(guān)鍵的一步就是從服務(wù)器獲得請求數(shù)據(jù)。要清楚這個過程和原理，我們必須對 XMLHttpRequest有所了解。
XMLHttpRequest是ajax的核心機制，它是在IE5中首先引入的，是一種支持異步請求的技術(shù)。簡單的說，也就是javascript可以及時向服務(wù)器提出請求和處理響應(yīng)，而不阻塞用戶。達到無刷新的效果。
所以我們先從XMLHttpRequest講起，來看看它的工作原理。
首先，我們先來看看XMLHttpRequest這個對象的屬性。
0 (未初始化) 對象已建立，但是尚未初始化（尚未調(diào)用open方法）
1 (初始化) 對象已建立，尚未調(diào)用send方法
2 (發(fā)送數(shù)據(jù)) send方法已調(diào)用，但是當前的狀態(tài)及http頭未知
3 (數(shù)據(jù)傳送中) 已接收部分數(shù)據(jù)，因為響應(yīng)及http頭不全，這時通過responseBody和responseText獲取部分數(shù)據(jù)會出現(xiàn)錯誤，
4 (完成) 數(shù)據(jù)接收完畢,此時可以通過通過responseXml和responseText獲取完整的回應(yīng)數(shù)據(jù)
但是，由于各瀏覽器之間存在差異，所以創(chuàng)建一個XMLHttpRequest對象可能需要不同的方法。這個差異主要體現(xiàn)在IE和其它瀏覽器之間。下面是一個比較標準的創(chuàng)建XMLHttpRequest對象的方法。
function CreateXmlHttp()
{
if(window.XmlHttpRequest) //非IE瀏覽器創(chuàng)建XmlHttpRequest對象
{
xmlhttp=new XmlHttpRequest();
}
if(window.ActiveXObject) //IE瀏覽器創(chuàng)建XmlHttpRequest對象
{
try
{
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
catch(e)
{
try{
xmlhttp=new ActiveXObject("msxml2.XMLHTTP");
}
catch(ex){}
} } }
function Ustbwuyi()
{
var data=document.getElementById("username").value;
CreateXmlHttp();
if(!xmlhttp)
{
alert("創(chuàng)建xmlhttp對象異常！");
return false;
}
xmlhttp.open("POST",url,false);
xmlhttp.onreadystatechange=function()
{
if(xmlhttp.readyState==4)
{
document.getElementById("user1").innerHTML="數(shù)據(jù)正在加載...";
if(xmlhttp.status==200)
{
document.write(xmlhttp.responseText);
} } }
xmlhttp.send();
}
如上所示，函數(shù)首先檢查XMLHttpRequest的整體狀態(tài)并且保證它已經(jīng)完成（readyStatus=4），即數(shù)據(jù)已經(jīng)發(fā)送完畢。然后根據(jù)服務(wù)器的設(shè)定詢問請求狀態(tài)，如果一切已經(jīng)就緒（status=200），那么就執(zhí)行下面需要的操作。
對于XmlHttpRequest的兩個方法，open和send，其中open方法指定了：
a、向服務(wù)器提交數(shù)據(jù)的類型，即post還是get。
b、請求的url地址和傳遞的參數(shù)。
c、傳輸方式，false為同步，true為異步。默認為true。如果是異步通信方式(true)，客戶機就不等待服務(wù)器的響應(yīng)；如果是同步方式(false)，客戶機就要等到服務(wù)器返回消息后才去執(zhí)行其他操作。我們需要根據(jù)實際需要來指定同步方式，在某些頁面中，可能會發(fā)出多個請求，甚至是有組織有計劃有隊形大規(guī)模的高強度的request，而后一個是會覆蓋前一個的，這個時候當然要指定同步方式。
Send方法用來發(fā)送請求。
知道了XMLHttpRequest的工作流程，我們可以看出，XMLHttpRequest是完全用來向服務(wù)器發(fā)出一個請求的，它的作用也局限于此，但它的作用是整個ajax實現(xiàn)的關(guān)鍵，因為ajax無非是兩個過程，發(fā)出請求和響應(yīng)請求。并且它完全是一種客戶端的技術(shù)。而XMLHttpRequest正是處理了服務(wù)器端和客戶端通信的問題所以才會如此的重要。
現(xiàn)在，我們對ajax的原理大概可以有一個了解了。我們可以把服務(wù)器端看成一個數(shù)據(jù)接口，它返回的是一個純文本流，當然，這個文本流可以是XML格式，可以是Html，可以是Javascript代碼，也可以只是一個字符串。這時候，XMLHttpRequest向服務(wù)器端請求這個頁面，服務(wù)器端將文本的結(jié)果寫入頁面，這和普通的web開發(fā)流程是一樣的，不同的是，客戶端在異步獲取這個結(jié)果后，不是直接顯示在頁面，而是先由javascript來處理，然后再顯示在頁面。至于現(xiàn)在流行的很多ajax控件，比如magicajax等，可以返回DataSet等其它數(shù)據(jù)類型，只是將這個過程封裝了的結(jié)果，本質(zhì)上他們并沒有什么太大的區(qū)別。