AJAX 簡介
AJAX允許通過與后臺的Web服務(wù)器交換數(shù)據(jù)來“異步”更新網(wǎng)頁內(nèi)容。
這意味著可以更新網(wǎng)頁的某些部分，而無需重新加載整個頁面。
使用AJAX，您可以：
- 將數(shù)據(jù)發(fā)送到Web服務(wù)器
- 從Web服務(wù)器讀取數(shù)據(jù)
- 更新網(wǎng)頁而無需重新加載頁面
AJAX示例
以下代碼顯示了AJAX的基本示例：
AJAX示例解釋
上面的實(shí)例核心源碼如下：
HTML代碼：
<!DOCTYPE html> <html> <div id="output"> <h2>AJAX將更改此文本</h2> <button onclick="fetchDoc()" type="button">發(fā)出請求</button> </div> </html>
HTML代碼包含一個<div>部分（<h2>和<button>）。用于顯示來自服務(wù)器的信息。
點(diǎn)按鈕擊<button> 時(shí)將調(diào)用fetchDoc()函數(shù)。
該函數(shù)從Web服務(wù)器請求數(shù)據(jù)并顯示（不重新加載頁面）：
function fetchDoc() {
var httpRequest = new XMLHttpRequest();
httpRequest.onreadystatechange = function() {
if (this.readyState === 4 && this.status === 200) {
document.getElementById("output").innerHTML = this.responseText;
}
};
httpRequest.open("GET", "ajax_intro.txt", true);
httpRequest.send();
}
什么是AJAX？
AJAX 即“Asynchronous Javascript And XML”（異步 JavaScript 和 XML）。
AJAX不是一種編程語言，它是一種用于從網(wǎng)頁訪問Web服務(wù)器的技術(shù)。
AJAX允許您在不重新加載頁面的情況下向服務(wù)器發(fā)出請求。
AJAX可以與服務(wù)器通信，交換數(shù)據(jù)和更新頁面，而無需刷新頁面。
AJAX可以發(fā)送和接收各種格式的信息，包括JSON，XML，HTML和文本文件。
簡而言之，就是使用XMLHttpRequest對象與服務(wù)器進(jìn)行通信。
AJAX的兩個主要功能使您可以執(zhí)行以下操作：
-
向服務(wù)器發(fā)出請求，而無需重新加載頁面
-
從服務(wù)器接收和處理數(shù)據(jù)
AJAX如何工作？
為了執(zhí)行AJAX通信，JavaScript使用一個XMLHttpRequest對象向服務(wù)器發(fā)出HTTP請求并作為響應(yīng)接收數(shù)據(jù)。
所有現(xiàn)代瀏覽器（Chrome，F(xiàn)irefox，IE7 +，Safari，Opera）都支持該XMLHttpRequest對象。
下圖說明了AJAX通信是如何工作的：
AJAX操作步驟
-
網(wǎng)頁中發(fā)生了一個事件（即頁面已加載或單擊了按鈕）
-
XMLHttpRequest對象由JavaScript創(chuàng)建
-
XMLHttpRequest對象將請求發(fā)送到Web服務(wù)器
-
服務(wù)器處理請求
-
服務(wù)器將響應(yīng)發(fā)送回網(wǎng)頁
-
響應(yīng)由JavaScript讀取
-
HTML DOM由JavaScript更新
您將學(xué)到什么
在本教程的下一章中，您將學(xué)習(xí)：
如何創(chuàng)建XMLHttpRequest對象
如何將數(shù)據(jù)發(fā)送到Web服務(wù)器（在后臺）
如何從Web服務(wù)器讀取數(shù)據(jù)（在后臺）
如何在不重新加載頁面的情況下更新網(wǎng)頁