AJAX（Asynchronous JavaScript and XML）是一種在不需要重新加載整個(gè)頁(yè)面的情況下，通過(guò) JavaScript 發(fā)送請(qǐng)求并接收響應(yīng)的技術(shù)。當(dāng)我們執(zhí)行一個(gè) AJAX 請(qǐng)求并成功返回時(shí)，success 函數(shù)將會(huì)被觸發(fā)執(zhí)行。

在 Web 開發(fā)中，我們經(jīng)常需要通過(guò) AJAX 從服務(wù)器端獲取數(shù)據(jù)，并在頁(yè)面上進(jìn)行展示或者進(jìn)行其他操作。比如，當(dāng)用戶在搜索框中輸入關(guān)鍵字時(shí)，我們可以通過(guò) AJAX 請(qǐng)求從服務(wù)器獲取相關(guān)的搜索結(jié)果并將其展示在頁(yè)面上，而不需要重新加載整個(gè)頁(yè)面。

一個(gè)常見的例子是在一個(gè)電商網(wǎng)站上添加商品到購(gòu)物車。假設(shè)有一個(gè)“添加到購(gòu)物車”的按鈕，當(dāng)用戶點(diǎn)擊該按鈕時(shí)，我們可以通過(guò) AJAX 請(qǐng)求將商品信息發(fā)送到服務(wù)器，并通過(guò)在 success 函數(shù)中更新頁(yè)面上的購(gòu)物車圖標(biāo)或者顯示一個(gè)彈框，告知用戶成功加入購(gòu)物車。以下是一個(gè)示例代碼：

$.ajax({
url: '/cart',
method: 'POST',
data: { productId: 123 },
success: function(response) {
$('#cart-icon').addClass('filled');
$('#cart-message').text('商品已成功加入購(gòu)物車！');
}
});

在上面的代碼中，我們使用了 jQuery 的ajax函數(shù)發(fā)送一個(gè) POST 請(qǐng)求到路徑為 '/cart' 的 URL。我們將商品的 ID 作為請(qǐng)求的數(shù)據(jù)發(fā)送到服務(wù)器。當(dāng)請(qǐng)求成功返回時(shí)，success 函數(shù)將會(huì)被觸發(fā)執(zhí)行。

在 success 函數(shù)中，我們通過(guò)選擇器$('#cart-icon')和$('#cart-message')更新了頁(yè)面上的購(gòu)物車圖標(biāo)和購(gòu)物車消息。我們通過(guò)為購(gòu)物車圖標(biāo)添加一個(gè)類名filled，使其顯示為已經(jīng)加入了商品。然后，我們通過(guò)修改購(gòu)物車消息顯示的文本，告知用戶商品已經(jīng)成功加入購(gòu)物車。

除了更新頁(yè)面上的內(nèi)容，我們還可以根據(jù) success 響應(yīng)的數(shù)據(jù)進(jìn)行其他操作。比如，在上面的例子中，服務(wù)器可以返回一個(gè)包含購(gòu)物車中的商品數(shù)量的 JSON 數(shù)據(jù)，我們可以根據(jù)該數(shù)據(jù)在頁(yè)面上顯示購(gòu)物車中的商品數(shù)量。以下是擴(kuò)展的示例代碼：

$.ajax({
url: '/cart',
method: 'POST',
data: { productId: 123 },
success: function(response) {
$('#cart-icon').addClass('filled');
$('#cart-message').text('商品已成功加入購(gòu)物車！');
$('#cart-count').text(response.count);
}
});

在上面的代碼中，我們通過(guò)選擇器$('#cart-count')更新了頁(yè)面上顯示購(gòu)物車中商品數(shù)量的元素。我們將服務(wù)器返回的數(shù)據(jù)中的商品數(shù)量賦值給該元素的文本內(nèi)容。這樣，用戶可以實(shí)時(shí)地看到購(gòu)物車中的商品數(shù)量。

總而言之，當(dāng)我們使用 AJAX 發(fā)送請(qǐng)求并成功返回時(shí)，success 函數(shù)是非常有用的。我們可以在該函數(shù)中更新頁(yè)面上的內(nèi)容或者進(jìn)行其他操作，使用戶可以即時(shí)體驗(yàn)到請(qǐng)求的結(jié)果。