AJAX（Asynchronous JavaScript and XML）是一種用于在不刷新整個頁面的情況下更新網頁內容的技術。它通過在后臺與服務器進行數據交換，實現異步刷新頁面的效果。通過使用AJAX，可以提高網頁的用戶體驗，并減少對服務器的請求次數。

例如，假設有一個在線商城的網頁，在加載商品列表時使用AJAX來進行異步刷新，可以使頁面展示更加流暢，用戶無需等待整個頁面加載完畢。當用戶在搜索框中輸入商品關鍵字時，AJAX會立即向服務器發送請求，獲取與關鍵字匹配的商品信息，并將其顯示在頁面上，不需要刷新整個頁面。這樣，用戶可以實時看到搜索結果，從而提高了用戶的體驗。

要實現異步刷新頁面，首先需要創建一個XMLHttpRequest對象，用于實現與服務器的數據交互。代碼如下：

var xhr = new XMLHttpRequest();

接下來，通過open方法指定請求的類型（GET或POST）以及請求的URL。例如，使用GET請求方式獲取商品列表的代碼如下：

xhr.open("GET", "https://www.example.com/api/products", true);

此處的URL是服務器端提供的一個API，用于返回商品列表的數據。第三個參數設置為true，表示以異步方式發送請求。

然后，需要設置xhr對象的回調函數，以獲取服務器返回的數據。這可以通過定義onreadystatechange事件處理程序來實現。該事件在xhr對象的狀態發生變化時觸發，我們可以在這個事件中處理服務器響應的數據。

例如，以下代碼展示了如何使用回調函數處理服務器返回的商品列表數據：

xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === 200) {
var data = JSON.parse(xhr.responseText);
// 在此處使用數據更新頁面
}
}
xhr.send();

在回調函數中，首先檢查xhr對象的readyState屬性是否為4，表示請求已完成并且響應已就緒。然后，使用xhr對象的status屬性檢查服務器響應的狀態碼是否為200，表示請求成功。

如果請求成功，我們可以使用xhr對象的responseText屬性（如果服務器返回的是純文本數據）或responseXML屬性（如果服務器返回的是XML數據）獲取服務器返回的數據。在示例中，我們使用JSON.parse函數將服務器返回的文本數據解析成JavaScript對象，然后在合適的位置使用這些數據更新頁面。

綜上所述，通過使用AJAX技術可以實現異步刷新頁面，提高了網頁的用戶體驗。無論是在線商城的商品搜索功能，還是社交媒體的實時更新，都可以通過AJAX來實現異步刷新頁面的效果。