本以為自己是做.net的,做項目就做技術(shù)含量高的,對那些網(wǎng)站前端根本不屑一顧。但最新的web項目只從美工和前端engineer那得到了些演示 demo,光憑這些根本達(dá)不到要求,用戶體驗也相當(dāng)?shù)牟凰C拦こ椴簧恚覀儙讉€搞后臺的只能自己動手,硬著頭皮調(diào)css,javascrip,后來發(fā)現(xiàn) ajax 確實挺管用,所以課余時間找了本書看看,閑暇時摘些關(guān)鍵橋段全當(dāng)涂鴉吧。
    1.到底什么是Ajax。
    Ajax最初是Asynchronous JavaScript+XML (異步JavaScript+XML)的縮寫,后來把允許瀏覽器與服務(wù)器通信而無需刷新當(dāng)前頁面的技術(shù)都涵蓋在內(nèi)了。
    傳統(tǒng)的web應(yīng)用允許用戶填寫表單(form),當(dāng)提交表單時就向web服務(wù)器發(fā)送一個請求。服務(wù)器接收并處理傳來的表單,然後返回一個新的網(wǎng)頁。這個做法浪費了許多帶寬,因為在前後兩個頁面中的大部分HTML代碼往往是相同的。由于每次應(yīng)用的交互都需要向服務(wù)器發(fā)送請求,應(yīng)用的響應(yīng)時間就依賴于服務(wù)器的響應(yīng)時間。這導(dǎo)致了用戶界面的響應(yīng)比本地應(yīng)用慢得多。
    與此不同,AJAX應(yīng)用可以僅向服務(wù)器發(fā)送并取回必需的數(shù)據(jù),它使用SOAP或其它一些基于XML的web service接口,并在客戶端采用JavaScript處理來自服務(wù)器的響應(yīng)。因為在服務(wù)器和瀏覽器之間交換的數(shù)據(jù)大量減少,結(jié)果我們就能看到響應(yīng)更快 的應(yīng)用。同時很多的處理工作可以在發(fā)出請求的客戶端機器上完成,所以Web服務(wù)器的處理時間也減少了。
    2.ajax 的優(yōu)缺點
     ajax動態(tài)修改頁面的功能使得瀏覽器無需刷新整個頁面即可完成與服務(wù)器的通信操作,避免了服務(wù)器回發(fā)重復(fù)頁面信息,減輕了帶寬負(fù)擔(dān),加快了響應(yīng)速度。也 正因為ajax局部刷新頁面,使得前一狀態(tài)的頁面信息無法保存在歷史紀(jì)錄中,瀏覽器的后退操作也無法正確獲取歷史頁面。開發(fā)人員針對這一問題已想出一些解 決的辦法,例如,將動態(tài)頁面放入iframe 中,如何獲得每一個狀態(tài)都會有相應(yīng)的參數(shù)保存在靜態(tài)的主頁面中,當(dāng)后退時只需通過這些參數(shù)重新獲得歷史狀態(tài)的動態(tài)頁面。
    3.基礎(chǔ)原理
    ajax 的關(guān)鍵是XMLHttpRequest 對象的應(yīng)用。
標(biāo)準(zhǔn)交互模式:
    1) 觸發(fā)ajax 事件
    2)建立CMLHttpRequest對象的一個實例。使用open()調(diào)用服務(wù)器處理程序文件。
    3)向服務(wù)器發(fā)送請求
    4)服務(wù)器處理程序
    5)請求返回瀏覽器
    6)對服務(wù)器的返回 進(jìn)行處理
<script type="text/javascript" >
    var xmlhttp;
function Createxmlhttp()
{ alert("Start Create");
    if(window.ActiveXObject)
    {
        alert("ActiveXObject");
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }else if (window.XMLHttpRequest)
    {
    alert("XMLHttpRequest");
    xmlhttp=new XMLHttpRequest();
    }
  
    xmlhttp.open("Get","Upload.aspx")
    xmlhttp.onreadystatechange=CallBack;
    xmlhttp.send(null);
}
function CallBack()
{
    alert("Call Back");
}

</script>