AJAX（Asynchronous JavaScript and XML）是一種用于在網頁上實現異步通信的技術。它可以提高網頁的交互性和用戶體驗。在網頁加載或執行耗時操作時，通常需要等待一段時間才能獲得結果。通過使用AJAX技術，我們可以實現頁面加載等待效果，讓用戶在等待過程中得到一種即時的反饋。

那么如何使用AJAX實現頁面加載等待效果呢？一種常見的方法是使用loading遮罩層。我們可以在頁面中加入一個半透明的遮罩層，覆蓋住整個頁面。當頁面加載或執行耗時操作時，可以通過AJAX發送請求，然后顯示loading圖標或提示信息在遮罩層上，以告知用戶操作正在進行中，需要耐心等待。

<div id="loading" style="position: fixed; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(0, 0, 0, 0.5); z-index: 9999;">
<img src="loading.gif" style="position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);">
<p style="text-align: center; color: #fff; font-size: 16px;">加載中，請稍候...</p>
</div>

在上述代碼中，我們首先創建了一個id為loading的div元素，并將其樣式設置為半透明的背景色。然后在該元素中插入了一個loading圖標和一條提示信息。通過設置該div元素的z-index為較大的值，確保它顯示在其他元素的前面。

接下來，我們可以使用JavaScript代碼來控制遮罩層的顯示與隱藏。當需要等待頁面加載或執行耗時操作時，我們可以通過AJAX在遮罩層上顯示loading效果，代碼如下：

function showLoading() {
document.getElementById("loading").style.display = "block";
}
function hideLoading() {
document.getElementById("loading").style.display = "none";
}
function loadData() {
showLoading();
// 使用AJAX發送請求，獲取數據
// 請求完成后隱藏loading效果
hideLoading();
}

在上述代碼中，我們使用了兩個函數showLoading和hideLoading來顯示和隱藏遮罩層。當調用showLoading函數時，它會將遮罩層的display樣式屬性設置為"block"，使其顯示出來。而調用hideLoading函數時，它會將遮罩層的display樣式屬性設置為"none"，使其隱藏起來。

當需要加載數據時，我們可以調用loadData函數，在函數中首先調用showLoading函數顯示loading效果，然后使用AJAX發送請求并獲取數據，最后在請求完成后調用hideLoading函數隱藏loading效果。

通過使用AJAX實現頁面加載等待效果，我們可以為用戶提供良好的用戶體驗。例如，當用戶提交一個表單時，可能會需要等待服務器處理數據并返回結果。在等待的過程中，用戶可以看到loading效果，以獲取即時的反饋，從而保持耐心等待。這種等待效果的設計可以使用戶感到頁面在工作中，并且用戶不會認為頁面卡頓或無響應。

總結起來，通過使用AJAX技術實現頁面加載等待效果，我們可以為用戶提供一個即時的反饋，讓用戶在等待過程中感到頁面正在工作，并且保持耐心等待。這樣的設計可以提高用戶體驗，讓用戶對我們的網站或應用程序留下更好的印象。