怎樣使用AJAX進行WEB應用程式開發

一、簡介

AJAX，一個非同步JavaScript和XML的縮減詞，是最近出來的技術詞語。非同步意味著你可以經由超文字傳輸通訊協定 (HTTP)(HTTP)向一個伺服器發出請求並且在等待該響應時繼續處理另外的資料。這就意味著，例如，你可以調用一個伺服器端指令碼來從一個資料庫中以XML方式檢索資料，把資料發送到儲存在一個資料庫的伺服器指令碼，或者簡單地裝載一個XML檔案以填充你的Web網站而不需重新整理該頁面。然而，在這項新技術提供巨大能力的同時，它也引起了在"Back"按鈕問題上的很多爭論。本文將協助你確定在真實世界中何時使用AJAX是最佳選擇。

首先，我假定你對縮減詞JavaScript和XML部分有一個基本瞭解。儘管你能通過AJAX請求任何類型的文字檔，但是我在此主要集中討論XML。我將解釋怎樣在真實世界中使用AJAX以及怎樣在一個工程中評估它的價值。在你讀完本文後，你將會明白什麼是AJAX，在什麼情況下，為什麼以及怎樣使用這項技術。你將要學習，在保持給使用者提供直觀體驗的同時怎樣建立對象，發出請求以及定製響應。

我已建立了一個適合於本文的樣本工程(你可以下載原始碼)。這個樣本實現了一個簡單的請求-它裝載一個包含頁面內容的XML檔案並且分析資料以把它顯示在一個HTML頁面中。

二、常規屬性和方法

表1和2提供了一個屬性和方法的概述- 它們為Windows Internet Explorer 5，Mozilla，Netscape 7，Safari 1.2，和Opera等瀏覽器所支援。

表1屬性

屬性 描述

onreadystatechange 當請求對象變化時該事件處理器啟用。

readyState 返回指示對象的目前狀態的值。

responseText 來自伺服器的響應串的版本 。

responseXML 來自伺服器的響應的DOM相容的文檔對象。

status 來自伺服器的響應的 狀態代碼。

statusText 以一個字串形式返回的狀態訊息。

表2方法

方法 描述

Abort() 取消當前HTTP請求。

getAllResponseHeaders() 檢索所有的HTTP頭值。

getResponseHeader("headerLabel") 從響應體中檢索一個HTTP頭部的值。

open("method","URL"[,asyncFlag[,"userName" [,"password"]]]) 初始化一個MSXML2.XMLHTTP請求，並從該請求指定方法，URL和認證資訊 。

send(content) 發送一個HTTP請求到伺服器並接收響應。

setRequestHeader ("label", "value") 指定一個HTTP頭的名字。

三、從哪裡開始

首先，你需要建立XML檔案-後面我們對之進行請求並作為頁面內容進行分析。你正在請求的檔案必須與 目標工程駐留在相同的伺服器上。

下一步，建立發出請求的HTML檔案。當頁面通過使用頁面主體 中的onload方法進行載入時，該請求發生。接著，該檔案需要一個有ID的div標籤，這樣當我們準備好要 顯示內容時就可以對之進行定位。當你做完所有這些，你的頁面的主體看上去如下：

＜body onload="makeRequest('xml/content.xml'); "＞

＜div id="copy"＞＜/div＞

＜/body＞