本以為自己是做.net的，做項(xiàng)目就做技術(shù)含量高的，對(duì)那些網(wǎng)站前端根本不屑一顧。但最新的web項(xiàng)目只從美工和前端engineer那得到了些演示demo，光憑這些根本達(dá)不到要求，用戶體驗(yàn)也相當(dāng)?shù)牟凰Ｃ拦こ椴簧恚覀儙讉€(gè)搞后臺(tái)的只能自己動(dòng)手，硬著頭皮調(diào)css,javascrip,后來發(fā)現(xiàn)ajax 確實(shí)挺管用，所以課余時(shí)間找了本書看看，閑暇時(shí)摘些關(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)提交表單時(shí)就向web服務(wù)器發(fā)送一個(gè)請(qǐng)求。服務(wù)器接收并處理傳來的表單，然後返回一個(gè)新的網(wǎng)頁。這個(gè)做法浪費(fèi)了許多帶寬，因?yàn)樵谇搬醿蓚€(gè)頁面中的大部分HTML代碼往往是相同的。由于每次應(yīng)用的交互都需要向服務(wù)器發(fā)送請(qǐng)求，應(yīng)用的響應(yīng)時(shí)間就依賴于服務(wù)器的響應(yīng)時(shí)間。這導(dǎo)致了用戶界面的響應(yīng)比本地應(yīng)用慢得多。
    與此不同，AJAX應(yīng)用可以僅向服務(wù)器發(fā)送并取回必需的數(shù)據(jù)，它使用SOAP或其它一些基于XML的web service接口，并在客戶端采用JavaScript處理來自服務(wù)器的響應(yīng)。因?yàn)樵诜?wù)器和瀏覽器之間交換的數(shù)據(jù)大量減少，結(jié)果我們就能看到響應(yīng)更快 的應(yīng)用。同時(shí)很多的處理工作可以在發(fā)出請(qǐng)求的客戶端機(jī)器上完成，所以Web服務(wù)器的處理時(shí)間也減少了。
    2.ajax 的優(yōu)缺點(diǎn)
     ajax動(dòng)態(tài)修改頁面的功能使得瀏覽器無需刷新整個(gè)頁面即可完成與服務(wù)器的通信操作，避免了服務(wù)器回發(fā)重復(fù)頁面信息，減輕了帶寬負(fù)擔(dān)，加快了響應(yīng)速度。也正因?yàn)閍jax局部刷新頁面，使得前一狀態(tài)的頁面信息無法保存在歷史紀(jì)錄中，瀏覽器的后退操作也無法正確獲取歷史頁面。開發(fā)人員針對(duì)這一問題已想出一些解決的辦法，例如，將動(dòng)態(tài)頁面放入iframe 中，如何獲得每一個(gè)狀態(tài)都會(huì)有相應(yīng)的參數(shù)保存在靜態(tài)的主頁面中，當(dāng)后退時(shí)只需通過這些參數(shù)重新獲得歷史狀態(tài)的動(dòng)態(tài)頁面。
    3.基礎(chǔ)原理
    ajax 的關(guān)鍵是XMLHttpRequest 對(duì)象的應(yīng)用。
標(biāo)準(zhǔn)交互模式：
    1) 觸發(fā)ajax 事件
    2）建立CMLHttpRequest對(duì)象的一個(gè)實(shí)例。使用open()調(diào)用服務(wù)器處理程序文件。
    3）向服務(wù)器發(fā)送請(qǐng)求
    4）服務(wù)器處理程序
    5）請(qǐng)求返回瀏覽器
    6）對(duì)服務(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>