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来获取服务器返回的数据，并将它们显示在网页上。这为开发人员提供了强大的工具来创建更加交互式和实时的网页应用程序。