AJAX簡介

  Ajax,使用它可以構建更爲動態和響應更靈敏的Web應用程序。該方法的關鍵在於對瀏覽器端的JavaScript、DHTML和與服務器異步通信的組合。本文也演示了啓用這種方法是多麼簡單:利用一個Ajax框架(指DWR)構造一個應用程序,它直接從瀏覽器與後端服務進行通信。如果使用得當,這種強大的力量可以使應用程序更加自然和響應靈敏,從而提升用戶的瀏覽體驗。

  該應用程序中所使用的示例代碼已打包爲單獨的WAR文件,可供下載。

簡介

  術語Ajax用來描述一組技術,它使瀏覽器可以爲用戶提供更爲自然的瀏覽體驗。在Ajax之前,Web站點強制用戶進入提交/等待/重新顯示範例,用戶的動作總是與服務器的“思考時間”同步。Ajax提供與服務器異步通信的能力,從而使用戶從請求/響應的循環中解脫出來。藉助於Ajax,可以在用戶單擊按鈕時,使用JavaScript和DHTML立即更新UI,並向服務器發出異步請求,以執行更新或查詢數據庫。當請求返回時,就可以使用JavaScript和CSS來相應地更新UI,而不是刷新整個頁面。最重要的是,用戶甚至不知道瀏覽器正在與服務器通信:Web站點看起來是即時響應的。

  雖然Ajax所需的基礎架構已經出現了一段時間,但直到最近異步請求的真正威力纔得到利用。能夠擁有一個響應極其靈敏的Web站點確實激動人心,因爲它最終允許開發人員和設計人員使用標準的HTML/CSS/JavaScript堆棧創建“桌面風格的(desktop-like)”可用性。

  通常,在J2EE中,開發人員過於關注服務和持久性層的開發,以至於用戶界面的可用性已經落後。在一個典型的J2EE開發週期中,常常會聽到這樣的話,“我們沒有可投入UI的時間”或“不能用HTML實現”。但是,以下Web站點證明,這些理由再也站不住腳了:

  所有這些Web站點都告訴我們,Web應用程序不必完全依賴於從服務器重新載入頁面來向用戶呈現更改。一切似乎就在瞬間發生。簡而言之,在涉及到用戶界面的響應靈敏度時,基準設得更高了。

定義Ajax

  Adaptive Path公司的Jesse James Garrett這樣定義Ajax

  Ajax不是一種技術。實際上,它由幾種蓬勃發展的技術以新的強大方式組合而成。Ajax包含:

  • 基於XHTMLCSS標準的表示;
  • 使用Document Object Model進行動態顯示和交互;
  • 使用XMLHttpRequest與服務器進行異步通信;
  • 使用JavaScript綁定一切。

  這非常好,但爲什麼要以Ajax命名呢?其實術語Ajax是由Jesse James Garrett創造的,他說它是“Asynchronous JavaScript + XML的簡寫”。

Ajax的工作原理

  Ajax的核心是JavaScript對象XmlHttpRequest。該對象在Internet Explorer 5中首次引入,它是一種支持異步請求的技術。簡而言之,XmlHttpRequest使您可以使用JavaScript向服務器提出請求並處理響應,而不阻塞用戶。

  在創建Web站點時,在客戶端執行屏幕更新爲用戶提供了很大的靈活性。下面是使用Ajax可以完成的功能:

  • 動態更新購物車的物品總數,無需用戶單擊Update並等待服務器重新發送整個頁面。
  • 提升站點的性能,這是通過減少從服務器下載的數據量而實現的。例如,在Amazon的購物車頁面,當更新籃子中的一項物品的數量時,會重新載入整個頁面,這必須下載32K的數據。如果使用Ajax計算新的總量,服務器只會返回新的總量值,因此所需的帶寬僅爲原來的百分之一。
  • 消除了每次用戶輸入時的頁面刷新。例如,在Ajax中,如果用戶在分頁列表上單擊Next,則服務器數據只刷新列表而不是整個頁面。
  • 直接編輯表格數據,而不是要求用戶導航到新的頁面來編輯數據。對於Ajax,當用戶單擊Edit時,可以將靜態表格刷新爲內容可編輯的表格。用戶單擊Done之後,就可以發出一個Ajax請求來更新服務器,並刷新表格,使其包含靜態、只讀的數據。 

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章