AJAX（Asynchronous JavaScript and XML）是一種用于創建交互性更強、更具動態性的網頁應用程序的技術。它通過異步數據傳輸和動態更新網頁內容，提供了更好的用戶體驗。在前端開發中，常常需要對表格數據進行增刪改操作。本文將介紹如何使用AJAX刪除表格數據，并通過舉例進行詳細說明。

在進行表格數據刪除操作時，通常需要觸發一個事件，比如點擊刪除按鈕。點擊事件將觸發一個AJAX請求，向后端發送刪除數據的請求，并更新前端頁面。在下面的示例中，我們將刪除一條表格數據，并使用AJAX實時更新前端頁面。

// HTML部分
<table id="data-table">
<thead>
<tr>
<th>姓名</th>
<th>年齡</th>
<th>操作</th>
</tr>
</thead>
<tbody>
<tr id="row-1">
<td>張三</td>
<td>25</td>
<td><button class="delete-btn" onclick="deleteData(1)">刪除</button></td>
</tr>
<tr id="row-2">
<td>李四</td>
<td>30</td>
<td><button class="delete-btn" onclick="deleteData(2)">刪除</button></td>
</tr>
</tbody>
</table>

// JavaScript部分
function deleteData(id) {
// 發送AJAX請求刪除數據
$.ajax({
url: "/delete",
method: "POST",
data: { id: id },
success: function(response) {
if (response.success) {
// 刪除成功后更新前端頁面
$("#row-" + id).remove();
}
}
});
}

在上述示例中，通過給刪除按鈕添加onclick事件觸發函數deleteData，并傳入刪除數據的id。deleteData函數會使用AJAX發送一個POST請求到后端的/delete接口，并攜帶刪除數據的id作為參數。后端接口會根據id刪除相應的數據，然后返回一個成功或失敗的響應。在success回調函數中，判斷如果返回的響應中success為true，則表示刪除成功，我們將使用jQuery的remove方法來刪除對應的表格行。

例如，假設我們點擊了第一行的刪除按鈕，會觸發deleteData(1)函數。該函數會發送一個AJAX請求到/delete接口，并攜帶id為1的參數。后端接口刪除id為1的數據后，返回一個成功的響應。前端頁面收到響應后，會找到id為row-1的表格行，并將其從DOM中移除，從而實現了刪除操作的實時更新。

總結來說，使用AJAX刪除表格數據是通過發送異步請求到后端，進行數據的刪除操作，并通過前端的DOM操作實時更新頁面。AJAX提供了更好的用戶體驗，使得刪除操作更加流暢和高效。