AJAX（Asynchronous JavaScript and XML）是一種在網頁中無需刷新整個頁面的情況下，通過異步請求向服務器發送數據并獲取響應的技術。它極大地提升了網頁的用戶體驗，使得頁面變得更加動態。通過AJAX，我們可以從服務器獲取數據庫中的數據，并在頁面上進行展示。這篇文章將介紹如何使用AJAX來獲取返回的數據庫數據，并通過舉例來說明其工作原理。

以一個簡單的電子商務網站為例，假設我們需要從數據庫中獲取商品的相關信息。我們可以通過AJAX發送一個異步請求，向服務器發送一個獲取商品信息的請求。服務器端收到請求后，查詢數據庫，然后將相應的數據以JSON格式返回給前端頁面。前端頁面再通過AJAX接收到這個響應，解析JSON，并將數據展示在網頁上。

<script>
function getProducts() {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
var response = JSON.parse(this.responseText);
// 解析返回的JSON數據并展示在頁面上
for (var i = 0; i < response.length; i++) {
document.getElementById("product-list").innerHTML += "<li>" + response[i].name + "</li>";
}
}
};
xhttp.open("GET", "getProducts.php", true);
xhttp.send();
}
getProducts();
</script>

在上面的代碼中，我們定義了一個名為getProducts的函數，該函數通過AJAX發送一個GET請求到getProducts.php文件。當服務器端返回響應時，我們使用JSON.parse函數解析返回的JSON數據。然后，我們使用JavaScript動態地將商品名稱添加到id為product-list的列表元素中。

下面是服務器端getProducts.php文件的示例代碼：

<?php
// 連接數據庫
$conn = new mysqli("localhost", "username", "password", "database_name");
// 查詢商品表格
$result = $conn->query("SELECT * FROM products");
$data = array();
// 將結果轉化為關聯數組，并添加到$data數組中
while($row = $result->fetch_assoc()) {
$data[] = $row;
}
// 將$data數組轉化為JSON格式返回給前端頁面
echo json_encode($data);
// 關閉數據庫連接
$conn->close();
?>

在getProducts.php文件中，我們首先連接到數據庫，并執行數據庫查詢以獲取商品信息。然后，我們將查詢結果轉換為關聯數組，并將其存儲在名為$data的數組中。最后，我們使用json_encode函數將$data數組轉換為JSON格式，并將其返回給前端頁面。

通過以上的代碼，我們可以通過AJAX從數據庫中獲取商品的相關信息，并在網頁上進行展示。這種方式極大地提升了用戶體驗，使網頁變得更加動態和實時。

總結起來，通過使用AJAX我們可以輕松地獲取返回的數據庫數據。我們只需要發送一個異步請求到服務器，然后解析服務器返回的JSON數據，并將數據展示在頁面上。這樣，我們就能夠動態地在網頁上展示最新的數據庫數據，提升用戶體驗。