AJAX（Asynchronous JavaScript and XML）是一種在網(wǎng)頁中實現(xiàn)異步查詢和顯示數(shù)據(jù)的技術(shù)。通過使用AJAX，網(wǎng)頁不需要刷新頁面就能夠向服務(wù)器發(fā)送請求并及時獲取數(shù)據(jù)，然后將數(shù)據(jù)以合適的方式顯示在網(wǎng)頁中。這種技術(shù)的好處是提高了用戶體驗，同時也減輕了服務(wù)器的壓力。

假設(shè)一個網(wǎng)頁中有一個搜索框，用戶在搜索框中輸入關(guān)鍵字后，網(wǎng)頁會自動顯示與關(guān)鍵字相關(guān)的搜索結(jié)果。而傳統(tǒng)的方式是用戶輸入關(guān)鍵字后，點擊“搜索”按鈕，然后等待頁面刷新，并且服務(wù)器需要重新查詢數(shù)據(jù)庫，最終將搜索結(jié)果顯示在頁面上。這種方式不僅浪費了用戶的時間，而且限制了用戶的操作。通過使用AJAX技術(shù)，可以實現(xiàn)用戶在輸入關(guān)鍵字時，頁面可以實時顯示搜索結(jié)果，而不需要刷新整個頁面。

下面是一個簡單的例子，演示了如何使用AJAX技術(shù)實現(xiàn)異步查詢和顯示數(shù)據(jù)。我們假設(shè)有一個學生信息的數(shù)據(jù)庫，包含了學生的姓名、年齡和成績。現(xiàn)在我們需要實現(xiàn)一個功能，在用戶輸入學生的姓名時，頁面會實時顯示該學生的年齡和成績。首先，我們需要在HTML文件中添加一個文本框用于用戶輸入學生的姓名，并添加一個div用于顯示查詢結(jié)果：

<input type="text" id="name" onkeyup="showStudentInfo()">
<div id="info"></div>

然后，我們需要編寫一個JavaScript函數(shù)showStudentInfo()來實現(xiàn)異步查詢和顯示數(shù)據(jù)的功能。該函數(shù)需要獲取用戶輸入的學生姓名，并發(fā)送AJAX請求到服務(wù)器。服務(wù)器根據(jù)學生姓名查詢數(shù)據(jù)庫，并將查詢結(jié)果返回給客戶端。客戶端接收到查詢結(jié)果后，將數(shù)據(jù)顯示在頁面上。下面是showStudentInfo()函數(shù)的代碼：

function showStudentInfo() {
var name = document.getElementById("name").value;
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("info").innerHTML = this.responseText;
}
};
xhttp.open("GET", "getstudentinfo.php?name="+name, true);
xhttp.send();
}

在上面的代碼中，我們使用XMLHttpRequest對象來發(fā)送AJAX請求，并監(jiān)聽其狀態(tài)的變化。當狀態(tài)變?yōu)?（請求已完成）并且狀態(tài)碼為200（請求成功）時，我們將服務(wù)器返回的數(shù)據(jù)顯示在頁面上。在發(fā)送AJAX請求時，我們將用戶輸入的學生姓名作為參數(shù)傳遞給服務(wù)器，服務(wù)器根據(jù)該參數(shù)查詢數(shù)據(jù)庫，然后將查詢結(jié)果返回給客戶端。客戶端根據(jù)查詢結(jié)果更新頁面上的div元素。

通過上面的例子，我們可以看到，使用AJAX技術(shù)可以實現(xiàn)異步查詢和顯示數(shù)據(jù)的功能。用戶在輸入學生姓名時，頁面實時顯示該學生的年齡和成績，而不需要刷新整個頁面。這樣不僅提高了用戶體驗，而且減輕了服務(wù)器的壓力。在實際開發(fā)中，我們可以根據(jù)具體的需求，使用AJAX來實現(xiàn)各種不同的功能，使網(wǎng)頁更加交互和動態(tài)。