AJAX（Asynchronous JavaScript and XML）是一種用于創(chuàng)建動態(tài)網頁的技術，它可以在不重新加載整個頁面的情況下向服務器發(fā)送請求并更新頁面上的部分內容。然而，當我們發(fā)送AJAX請求時，由于網絡通信的延遲或返回數據的處理復雜性，用戶可能需要等待一段時間才能看到結果。為了提升用戶體驗，我們可以通過顯示一個loading動畫來告知用戶請求正在進行中。本文將介紹如何使用AJAX發(fā)送請求時顯示loading的方法，并通過具體的示例來說明。

為了實現AJAX請求時顯示loading效果，我們可以使用JavaScript來操控DOM元素的顯示和隱藏。首先，在發(fā)送AJAX請求之前，我們可以在頁面中添加一個loading元素，并為其設置CSS樣式。當用戶發(fā)起請求后，我們通過調用該元素的display屬性將其顯示出來；當請求完成后，我們通過設置display屬性為none來隱藏loading元素。

接下來，我們可以編寫JavaScript代碼，使用AJAX發(fā)送請求，并在請求過程中顯示loading效果。在以下示例中，我們將使用jQuery庫來簡化AJAX請求的操作。

$(document).ajaxStart(function() {
$('.loading').show();
});
$(document).ajaxStop(function() {
$('.loading').hide();
});
$.ajax({
url: 'example.com/api/data',
method: 'GET',
success: function(response) {
// 請求成功后的處理邏輯
},
error: function(error) {
// 請求失敗后的處理邏輯
}
});

在這個例子中，我們通過ajaxStart和ajaxStop事件來分別在AJAX請求開始和結束時顯示和隱藏loading元素。當請求開始時，我們調用show()方法顯示loading元素；當請求結束時，我們調用hide()方法隱藏loading元素。

使用AJAX發(fā)送請求并顯示loading的效果可以改善用戶體驗，讓用戶知道請求正在進行中，避免用戶誤以為頁面出現了問題或被卡住。通過上述示例，我們可以很容易地實現此功能，并根據具體需求對loading元素的樣式和顯示方式進行定制。無論是加載大量數據、上傳文件還是其他需要等待的操作，都可以借助AJAX和loading效果來提升用戶體驗。