AJAX 簡介
AJAX允許通過與后臺的Web服務器交換數據來“異步”更新網頁內容。
這意味著可以更新網頁的某些部分，而無需重新加載整個頁面。
使用AJAX，您可以：
- 將數據發(fā)送到Web服務器
- 從Web服務器讀取數據
- 更新網頁而無需重新加載頁面
AJAX示例
以下代碼顯示了AJAX的基本示例：
AJAX示例解釋
上面的實例核心源碼如下：
HTML代碼：
<!DOCTYPE html> <html> <div id="output"> <h2>AJAX將更改此文本</h2> <button onclick="fetchDoc()" type="button">發(fā)出請求</button> </div> </html>
HTML代碼包含一個<div>部分（<h2>和<button>）。用于顯示來自服務器的信息。
點按鈕擊<button> 時將調用fetchDoc()函數。
該函數從Web服務器請求數據并顯示（不重新加載頁面）：
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不是一種編程語言，它是一種用于從網頁訪問Web服務器的技術。
AJAX允許您在不重新加載頁面的情況下向服務器發(fā)出請求。
AJAX可以與服務器通信，交換數據和更新頁面，而無需刷新頁面。
AJAX可以發(fā)送和接收各種格式的信息，包括JSON，XML，HTML和文本文件。
簡而言之，就是使用XMLHttpRequest對象與服務器進行通信。
AJAX的兩個主要功能使您可以執(zhí)行以下操作：
-
向服務器發(fā)出請求，而無需重新加載頁面
-
從服務器接收和處理數據
AJAX如何工作？
為了執(zhí)行AJAX通信，JavaScript使用一個XMLHttpRequest對象向服務器發(fā)出HTTP請求并作為響應接收數據。
所有現代瀏覽器（Chrome，Firefox，IE7 +，Safari，Opera）都支持該XMLHttpRequest對象。
下圖說明了AJAX通信是如何工作的：
AJAX操作步驟
-
網頁中發(fā)生了一個事件（即頁面已加載或單擊了按鈕）
-
XMLHttpRequest對象由JavaScript創(chuàng)建
-
XMLHttpRequest對象將請求發(fā)送到Web服務器
-
服務器處理請求
-
服務器將響應發(fā)送回網頁
-
響應由JavaScript讀取
-
HTML DOM由JavaScript更新
您將學到什么
在本教程的下一章中，您將學習：
如何創(chuàng)建XMLHttpRequest對象
如何將數據發(fā)送到Web服務器（在后臺）
如何從Web服務器讀取數據（在后臺）
如何在不重新加載頁面的情況下更新網頁