AJAX（Asynchronous JavaScript and XML）是一種用于創建動態網頁的技術，通過在不重新加載整個頁面的情況下向服務器發送請求并獲取響應來實現。它使用戶能夠在不中斷當前瀏覽的情況下，異步地獲取服務器的數據并更新網頁內容。這種動態加載數據庫數據的方法在各種網站和應用程序中被廣泛應用，大大提升了用戶體驗和交互性。

假設我們正在開發一個電子商務網站，我們需要從數據庫中獲取商品信息并動態地展示在網頁上。使用傳統的方式，在用戶每次點擊頁面時都重新加載整個頁面來獲取商品信息是一種低效且不友好的方式。而使用AJAX技術，我們可以通過向服務器發送異步請求來獲取商品信息，然后通過JavaScript將這些信息展示到網頁上，而不會導致整個頁面的刷新。

function loadProducts() {
const xhr = new XMLHttpRequest();
xhr.open('GET', 'product.php', true);
xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === 200) {
const products = JSON.parse(xhr.responseText);
// 將商品信息展示在網頁上的代碼
// ...
}
};
xhr.send();
}

在上面的例子中，我們定義了一個名為loadProducts的函數，在函數內部創建了一個XMLHttpRequest對象xhr，并使用open方法定義了使用GET請求從product.php獲取商品信息。然后，我們通過onreadystatechange事件處理程序來檢測請求的狀態和響應的狀態碼。當請求的狀態為4（表示請求完成）且響應的狀態碼為200（表示請求成功）時，我們將從服務器獲取到的商品信息解析為JavaScript對象，并通過相應的代碼將其展示到網頁上。

除了展示商品信息，我們還可以通過AJAX動態加載數據來實現其他的功能和交互效果。例如，我們可以在用戶輸入關鍵字搜索時，通過AJAX向服務器發送異步請求來獲取匹配的商品，并實時展示搜索結果，而不需要刷新整個頁面。這種方式不僅提升了搜索的效率，還能提供更好的用戶體驗。

function searchProducts(keyword) {
const xhr = new XMLHttpRequest();
xhr.open('GET', 'search.php?keyword=' + keyword, true);
xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === 200) {
const results = JSON.parse(xhr.responseText);
// 將搜索結果展示在網頁上的代碼
// ...
}
};
xhr.send();
}

在上面的例子中，我們定義了一個名為searchProducts的函數，它接受一個關鍵字作為參數。我們通過將關鍵字作為查詢參數傳遞給search.php來發送異步請求。當請求完成并響應成功時，我們將搜索結果解析為JavaScript對象，并通過相應的代碼將其展示到網頁上。

總而言之，AJAX技術使我們能夠通過異步請求獲取服務器的數據并實時地更新網頁內容，從而提升用戶體驗和交互性。我們可以使用AJAX動態加載數據庫數據來展示商品信息、搜索結果等產品信息。這種方式減少了頁面的刷新，提升了網頁的性能和效率。