在使用瀏覽器瀏覽網頁的時候，當頁面刷新很慢的時候，你的瀏覽器在干什么？你的屏幕內容是什么？是的，你的瀏覽器在等待刷新，而你的屏幕內容是一片空白，而你在屏幕前苦苦的等待瀏覽器的響應。開發人員為了克服這種尷尬的局面，不得不在每一個可能需要長時間等待響應的頁面上增加一個DIV，告訴用戶“系統正在處理您的請求，請稍候……”。

現在，有一種越來越流行越熱的“老”技術，可以徹底改變這種窘迫的局面。那就是AJAX。如今，隨著Gmail、Google-maps的應用和各種瀏覽器的支持，AJAX正逐漸吸引全世界的眼球。

一、AJAX定義

AJAX（Asynchronous JavaScript and XML）其實是多種技術的綜合，包括Javascript、XHTML和CSS、DOM、XML和XSTL、XMLHttpRequest。其中：

使用XHTML和CSS標準化呈現，使用DOM實現動態顯示和交互，使用XML和XSTL進行數據交換與處理，使用XMLHttpRequest對象進行異步數據讀取，使用Javascript綁定和處理所有數據。

在AJAX提出之前，業界對于上述技術都只是單獨的使用，沒有綜合使用，也是由于之前的技術需求所決定的。隨著應用的廣泛，AJAX也成為香餑餑了。

二、現狀與需要解決的問題

傳統的Web應用采用同步交互過程，這種情況下，用戶首先向HTTP服務器觸發一個行為或請求的呼求。反過來，服務器執行某些任務，再向發出請求的用戶返回一個HTML頁面。這是一種不連貫的用戶體驗，服務器在處理請求的時候，用戶多數時間處于等待的狀態，屏幕內容也是一片空白。如下圖：

 

 

 

自從采用超文本作為Web傳輸和呈現之后，我們都是采用這么一套傳輸方式。當負載比較小的時候，這并不會體現出有什么不妥?？墒钱斬撦d比較大，響應時間要很長，1分鐘、2分鐘……數分鐘的時候，這種等待就不可忍受了。嚴重的，超過響應時間，服務器干脆告訴你頁面不可用。另外，某些時候，我只是想改變頁面一小部分的數據，那為什么我必須重新加載整個頁面呢？！當軟件設計越來越講究人性化的時候，這么糟糕的用戶體驗簡直與這種原則背道而馳。為什么老是要讓用戶等待服務器取數據呢？至少，我們應該減少用戶等待的時間?，F在，除了程序設計、編碼優化和服務器調優之外，還可以采用AJAX。

三、為什么使用AJAX

與傳統的Web應用不同，AJAX采用異步交互過程。AJAX在用戶與服務器之間引入一個中間媒介，從而消除了網絡交互過程中的處理—等待—處理—等待缺點。用戶的瀏覽器在執行任務時即裝載了AJAX引擎。AJAX引擎用JavaScript語言編寫，通常藏在一個隱藏的框架中。它負責編譯用戶界面及與服務器之間的交互。AJAX引擎允許用戶與應用軟件之間的交互過程異步進行，獨立于用戶與網絡服務器間的交流?，F在，可以用Javascript調用AJAX引擎來代替產生一個HTTP的用戶動作，內存中的數據編輯、頁面導航、數據校驗這些不需要重新載入整個頁面的需求可以交給AJAX來執行。

 

 

 

使用AJAX，可以為ISP、開發人員、終端用戶帶來可見的便捷：

• 減輕服務器的負擔。AJAX的原則是“按需取數據”，可以最大程度的減少冗余請求，和響應對服務器造成的負擔。
• 無刷新更新頁面，減少用戶心理和實際的等待時間。特別的，當要讀取大量的數據的時候，不用像Reload那樣出現白屏的情況，AJAX使用XMLHTTP對象發送請求并得到服務器響應，在不重新載入整個頁面的情況下用Javascript操作DOM最終更新頁面。所以在讀取數據的過程中，用戶所面對的不是白屏，是原來的頁面內容（也可以加一個Loading的提示框讓用戶知道處于讀取數據過程），只有當數據接收完畢之后才更新相應部分的內容。這種更新是瞬間的，用戶幾乎感覺不到。
• 帶來更好的用戶體驗。
• 可以把以前一些服務器負擔的工作轉嫁到客戶端，利用客戶端閑置的能力來處理，減輕服務器和帶寬的負擔，節約空間和寬帶租用成本。
• 可以調用外部數據。
• 基于標準化的并被廣泛支持的技術，不需要下載插件或者小程序。
• 進一步促進頁面呈現和數據的分離。

四、誰在使用AJAX

在應用AJAX開發上面，Google當仁不讓是表率。Orkut、Gmail、Google Groups、Google Maps、Google Suggest都應用了這項技術。Amazon的A9.com搜索引擎也采用了類似的技術。

微軟也在積極開發更為完善的AJAX應用：它即將推出代號為Atlas的AJAX工具。Atlas的功能超越了AJAX本身，包括整合Visual Studio的調試功能。另外，新的ASP.NET控件將使客戶端控件與服務器端代碼的捆綁更為簡便。Atlas客戶腳本框架（Atlas Clent Script Framework）也使與網頁及相關項目的交互更為便利。但Visual Studio 2005中并不包含此項功能。

微軟最近宣布Atlas客戶腳本框架將包含如下內容（詳細資料請訪問Atlas計劃網站）：

• 一個可擴展的核心框架，它添加了JavaScript功能：如生命同時期管理、繼承管理、多點傳送處理器和界面管理。
• 一個常見功能的基本類庫，有豐富的字符串處理、計時器和運行任務。
• 為HTML附加動態行為的用戶界面框架。
• 一組用來簡化服務器連通和網絡訪問的網絡堆棧。
• 一組豐富的用戶界面開發控件，如：自動完成的文本框、動畫和拖放。
• 處理瀏覽器腳本行為差異的瀏覽器兼容層面。

典型的，微軟將AJAX技術應用在MSN Space上面。很多人一直都對MS Space服務感到很奇怪，當提交回復評論以后，瀏覽器會暫時停頓一下，然后在無刷新的情況下把我提交的評論顯示出來。這個就是應用了AJAX的效果。試想，如果添加一個評論就要重新刷新整個頁面，那可真費事。

目前，AJAX應用最普遍的領域是GIS-Map方面。GIS的區域搜索強調快速響應，AJAX的特點正好符合這種需求。

五、用AJAX改進你的設計

AJAX雖然可以實現無刷新更新頁面內容，但是也不是什么地方都可以用，主要應用在交互較多、頻繁讀數據、數據分類良好的Web應用中。現在，讓我們舉兩個例子，看看如何用AJAX改進你的設計。

例子1：數據校驗

在輸入form表單內容的時候，我們通常需要確保數據的唯一性。因此，常常在頁面上提供“唯一性校驗”按鈕，讓用戶點擊，打開一個校驗小窗口；或者等form提交到服務器端，由服務器判斷后在返回相應的校驗信息。前者，window.open操作本來就是比較耗費資源的，通常由window. showModalDialog代替，即使這樣也要彈出一個對話框；后者，需要把整個頁面提交到服務器并由服務器判斷校驗，這個過程不僅時間長而且加重了服務器負擔。而使用AJAX，這個校驗請求可以由XMLHttpRequest對象發出，整個過程不需要彈出新窗口，也不需要將整個頁面提交到服務器，快速又不加重服務器負擔。例子2：按需取數據—級聯菜單

以前，為了避免每次對菜單的操作引起的重載頁面，不采用每次調用后臺的方式，而是一次性將級聯菜單的所有數據全部讀取出來并寫入數組，然后根據用戶的操作用JavaScript來控制它的子集項目的呈現，這樣雖然解決了操作響應速度、不重載頁面以及避免向服務器頻繁發送請求的問題，但是如果用戶不對菜單進行操作或只對菜單中的一部分進行操作的話，那讀取的數據中的一部分就會成為冗余數據而浪費用戶的資源，特別是在菜單結構復雜、數據量大的情況下（比如菜單有很多級、每一級菜又有上百個項目），這種弊端就更為突出。

現在應用AJAX，在初始化頁面時我們只讀出它的第一級的所有數據并顯示，在用戶操作一級菜單其中一項時，會通過Ajax向后臺請求當前一級項目所屬的二級子菜單的所有數據，如果再繼續請求已經呈現的二級菜單中的一項時，再向后面請求所操作二級菜單項對應的所有三級菜單的所有數據，以此類推……這樣，用什么就取什么、用多少就取多少，就不會有數據的冗余和浪費，減少了數據下載總量，而且更新頁面時不用重載全部內容，只更新需要更新的那部分即可，相對于后臺處理并重載的方式縮短了用戶等待時間，也把對資源的浪費降到最低。

例子3：讀取外部數據

AJAX可以調用外部數據，因此，可以對一些開發的數據比如XML文檔、RSS文檔進行二次加工，實現數據整合或者開發應用程序。六、AJAX的缺陷

AJAX不是完美的技術。使用AJAX，它的一些缺陷不得不權衡一下：

• AJAX大量使用了Javascript和AJAX引擎，而這個取決于瀏覽器的支持。IE5.0及以上、Mozilla1.0、NetScape7及以上版本才支持，Mozilla雖然也支持AJAX，但是提供XMLHttpRequest的方式不一樣。所以，使用AJAX的程序必須測試針對各個瀏覽器的兼容性。
• AJAX更新頁面內容的時候并沒有刷新整個頁面，因此，網頁的后退功能是失效的；有的用戶還經常搞不清楚現在的數據是舊的還是已經更新過的。這個就需要在明顯位置提醒用戶“數據已更新”。
• 對流媒體的支持沒有FLASH、Java Applet好。
• 一些手持設備（如手機、PDA等）現在還不能很好的支持Ajax。