Ajax是一種能夠實現無刷新加載數據的技術，通過Ajax，我們可以向服務器發送請求，并在不刷新整個頁面的情況下獲取新的數據。本文將介紹如何使用Ajax傳入要刪除的文章的id，以及相關的例子。 在許多Web應用程序中，我們經常需要刪除一篇文章。傳統的做法是，當用戶點擊刪除按鈕時，頁面會重新加載，服務器接收到請求后，刪除相應的文章，并返回刪除后的頁面。然而，這種方式會導致整個頁面重新加載，不僅效率低下，而且用戶體驗差。 使用Ajax可以解決這個問題。當用戶點擊刪除按鈕時，我們可以使用Ajax發送一個請求到服務器，并傳入要刪除的文章的id。服務器接收到請求后，根據id刪除相應的文章，并返回一個刪除成功的消息或狀態碼。在前端，我們可以根據服務器返回的結果進行相應的處理，比如提示用戶刪除成功或刷新文章列表等操作。這樣就實現了在不刷新整個頁面的情況下刪除一篇文章。 讓我們通過一個例子來說明。假設我們有一個文章列表頁面，每篇文章都有一個刪除按鈕。當用戶點擊某篇文章的刪除按鈕時，我們使用Ajax發送一個POST請求到服務器，將要刪除的文章的id作為參數傳遞給服務器。服務器接收到請求后，刪除對應id的文章，并返回一個刪除成功的消息。前端收到服務器的響應后，可以根據結果進行相應的處理。比如，我們可以使用JavaScript動態刪除相應的文章元素，或者在一個提示框中顯示刪除成功的消息。 下面是使用jQuery實現刪除文章的Ajax代碼示例： ```html

文章列表：

<ul id="article-list">
<li id="article-1">
<span>文章標題1</span>
<button class="delete-btn" onclick="deleteArticle(1)">刪除</button>
</li>
<li id="article-2">
<span>文章標題2</span>
<button class="delete-btn" onclick="deleteArticle(2)">刪除</button>
</li>
<li id="article-3">
<span>文章標題3</span>
<button class="delete-btn" onclick="deleteArticle(3)">刪除</button>
</li>
</ul>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script>
function deleteArticle(id) {
$.ajax({
url: '/delete-article',
type: 'POST',
data: { id: id },
success: function(response) {
if (response.success) {
// 刪除文章元素
$('#article-' + id).remove();
// 顯示刪除成功的消息
alert('文章刪除成功');
}
}
});
}
</script>

在上面的代碼中，我們使用了jQuery的Ajax方法來發送POST請求。url參數指定了后端處理刪除文章的接口地址，type參數指定了請求的類型，data參數是一個對象，用來傳遞要刪除的文章的id。在服務器端，我們將接收到的id參數來刪除對應的文章，并返回一個JSON對象，其中success屬性表示刪除是否成功。 在success回調函數中，我們首先判斷服務器返回的success屬性是否為true，如果是，則使用jQuery的remove方法刪除對應的文章元素。然后，我們使用alert方法彈出一個刪除成功的消息框。 通過以上的代碼示例，我們可以實現在不刷新整個頁面的情況下，刪除某篇文章并給出相應的反饋。這種方式不僅提高了用戶體驗，而且提升了頁面性能。