AJAX（Asynchronous JavaScript and XML）是一種用于創建快速動態網頁的技術。通過AJAX，我們可以直接從服務器端獲取數據，而無需刷新整個網頁。本文將介紹如何使用AJAX獲取response中的數據，并通過舉例來說明AJAX的使用。

當我們需要從后臺獲取數據時，可以使用AJAX來實現。一個常見的應用場景是獲取用戶信息。假設我們有一個網頁，用戶可以輸入他們的用戶名并點擊一個按鈕來獲取他們的年齡。我們可以通過AJAX從服務器獲取與這個用戶名對應的年齡數據。下面是一個簡單的示例代碼，展示了如何使用AJAX來獲取response中的數據。

function getUserAge() {
var userName = document.getElementById("username").value;
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
var age = this.responseText;
document.getElementById("user-age").innerHTML = "用戶" + userName + "的年齡是" + age + "歲。";
}
};
xhttp.open("GET", "get_user_age.php?username=" + userName, true);
xhttp.send();
}

在上面的代碼中，我們首先獲取用戶輸入的用戶名。然后，創建一個新的XMLHttpRequest對象，用于與服務器進行通信。當這個對象的狀態發生變化時，我們使用回調函數來處理服務器返回的數據。如果狀態為4（請求已完成）和狀態碼為200（表示成功），我們將獲取到的年齡數據顯示在HTML頁面上。

上面的代碼使用了GET請求，將用戶名作為查詢參數傳遞給服務器的get_user_age.php文件。服務器將根據用戶名查詢并返回用戶的年齡數據。

除了GET請求，我們也可以使用POST請求來發送數據給服務器。例如，我們可以通過一個表單來提交用戶的用戶名，然后將這個用戶名作為POST請求的數據發送給服務器。下面是一個使用POST請求的示例代碼：

function getUserAge() {
var userName = document.getElementById("username").value;
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
var age = this.responseText;
document.getElementById("user-age").innerHTML = "用戶" + userName + "的年齡是" + age + "歲。";
}
};
xhttp.open("POST", "get_user_age.php", true);
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhttp.send("username=" + userName);
}

上面的代碼將請求方法改為POST，并使用xhttp.setRequestHeader()方法來設置請求頭。我們將用戶名作為請求體發送給服務器。

使用AJAX獲取response中的數據是創建動態網頁的重要步驟之一。通過上述示例，我們可以看到如何使用AJAX來獲取服務器返回的數據，并將它們顯示在網頁上。這為開發人員提供了強大的工具來創建更加交互式和實時的網頁應用程序。