AJAX（Asynchronous JavaScript and XML）是一種用于在Web頁面上獲取后端數據的技術。它通過異步請求，從后端服務器獲取數據，并實時更新頁面內容，提高用戶體驗。

假設我們正在開發一個在線電影訂購網站，需要使用AJAX從后端獲取電影列表。當用戶瀏覽網站時，頁面上會顯示電影海報、名稱和簡介。一種常見的做法是將電影數據存儲在后端數據庫中，并使用AJAX技術從數據庫中獲取數據。

下面是一個使用AJAX獲取后端數據的示例：

// 創建XMLHttpRequest對象
var xhr = new XMLHttpRequest();
// 指定請求類型和URL地址
xhr.open('GET', 'http://example.com/movies', true);
// 注冊事件監聽器，處理服務器響應
xhr.onload = function() {
if (xhr.status === 200) {
// 獲取后端返回的數據
var movies = JSON.parse(xhr.responseText);
// 更新頁面內容
var movieList = document.getElementById('movieList');
for (var i = 0; i < movies.length; i++) {
var movie = movies[i];
var movieItem = document.createElement('div');
movieItem.innerHTML = '<img src="' + movie.poster + '"><h3>' + movie.name + '</h3><p>' + movie.description + '</p>';
movieList.appendChild(movieItem);
}
}
};
// 發送請求
xhr.send();

在示例中，我們首先創建了一個XMLHttpRequest對象，該對象允許我們從服務器獲取數據。然后，我們使用open方法指定請求的類型（這里是GET）和URL地址。第三個參數設置為true，表示我們要使用異步方式進行請求。

接下來，我們注冊了一個事件監聽器（onload），該監聽器在服務器響應返回后被觸發。在監聽器中，我們通過xhr.status判斷服務器返回的狀態是否為成功（200）。如果成功，我們使用JSON.parse方法解析響應文本，并將其轉換為JavaScript對象（movies）。然后，我們使用DOM操作更新頁面內容，通過循環遍歷movies數組，并將每個電影的海報、名稱和簡介添加到頁面中。

當我們在瀏覽器中訪問該頁面時，AJAX會自動發起請求，并在服務器返回數據后更新頁面內容，顯示電影列表。

除了GET請求，我們還可以使用AJAX發送其他類型的請求，例如POST、PUT和DELETE。例如，如果用戶希望訂購電影，我們可以使用AJAX發送一個與后端交互的POST請求：

// 創建XMLHttpRequest對象
var xhr = new XMLHttpRequest();
// 指定請求類型和URL地址
xhr.open('POST', 'http://example.com/orders', true);
// 設置請求頭部信息
xhr.setRequestHeader('Content-Type', 'application/json');
// 注冊事件監聽器，處理服務器響應
xhr.onload = function() {
if (xhr.status === 200) {
alert('訂單提交成功！');
}
};
// 發送請求
xhr.send(JSON.stringify({
movieId: 123,
quantity: 2
}));

在上述示例中，我們使用XMLHttpRequest對象的open方法將請求類型設為POST，并指定URL地址。我們還使用setRequestHeader方法設置了請求的頭部信息，告訴服務器我們要發送的是JSON數據。

如果服務器成功創建訂單，它將返回狀態碼200，并在AJAX響應的監聽器中顯示一個消息框表示訂單提交成功。

AJAX技術可以應用于各種Web開發場景，例如在線商店、社交媒體和即時消息應用程序。通過使用AJAX，我們可以在不刷新整個頁面的情況下與后端服務器進行交互，并實時更新內容，提供更好的用戶體驗。

總結來說，通過AJAX技術，我們可以從后端獲取數據并在頁面上進行實時展示，從而提高用戶體驗。無論是獲取電影列表還是提交訂單，AJAX都能夠滿足我們的需求。