在傳統的網頁開發中，當需要更新頁面數據時，通常需要刷新整個頁面。然而，隨著AJAX（Asynchronous JavaScript and XML）技術的出現，我們可以通過使用AJAX實現無需刷新頁面而改變表格的功能。這使得用戶能夠更加流暢地瀏覽網頁，提升了用戶體驗。

舉個例子來說明AJAX如何不刷新頁面而更新表格。假設我們有一個學生管理系統，其中有一個學生列表的表格。傳統的做法是當我們要添加一名新學生時，需要重新加載整個頁面以獲取最新的學生列表。然而，使用AJAX我們可以通過在后臺發送異步請求，獲取到新的學生數據，然后將其添加到表格中，而不需要刷新整個頁面。

$.ajax({
url: "add_student.php",
type: "POST",
data: { name: "John", age: 20 },
success: function(response) {
// 通過AJAX成功添加學生后，更新表格
var newStudent = JSON.parse(response);
var newRow = "" + newStudent.name + "" + newStudent.age + "";
$("#student-table").append(newRow);
}
});

通過上述代碼，我們可以看到AJAX的使用非常簡單。首先，我們調用了jQuery中的ajax方法，指定了后臺處理添加學生請求的URL。然后，通過指定POST請求的類型和傳遞給服務器的數據，我們可以在后臺完成添加學生的操作。當請求成功返回時，我們通過解析服務器返回的JSON數據，將新的學生數據添加到表格中。整個過程不需要刷新頁面，用戶可以即時看到新添加的學生。

除了添加數據，AJAX還能夠用于刪除和更新表格中的數據。例如，當我們要刪除一名學生時，可以通過AJAX發送異步請求到后臺進行刪除操作，并且在請求成功返回后，通過操作DOM元素，將該學生所在的表格行從表格中刪除，而不需要刷新整個頁面。

function deleteStudent(id) {
$.ajax({
url: "delete_student.php",
type: "POST",
data: { id: id },
success: function() {
// 通過AJAX成功刪除學生后，從表格中移除該行
$("#" + id).remove();
}
});
}

上述代碼演示了如何使用AJAX刪除一名學生。當我們調用deleteStudent函數并傳入學生的ID時，它會發送異步請求到后臺進行刪除操作。當請求成功返回時，我們通過使用jQuery的remove方法找到該學生在表格中的行，并將其從DOM中移除。同樣地，這一過程不需要刷新頁面。

總結來說，AJAX技術使得我們可以在不刷新整個頁面的情況下更新表格數據。通過發送異步請求并在請求成功返回后操作DOM元素，我們可以添加、刪除和更新表格中的數據，提升了用戶體驗。使用AJAX不僅可以減少頁面刷新次數，還可以減少帶寬的使用，提高頁面的加載速度。因此，在現代網頁開發中，AJAX已經成為一項重要的技術。