XHR 创建对象

XMLHttpRequest（XHR）是一个用于在后台与服务器交换数据的对象。它可以在不重新加载整个页面的情况下更新页面的部分内容。在使用 AJAX 进行数据交互时，XHR 是非常重要的。

创建 XHR 对象

要使用 XHR 对象，首先需要创建一个新的 XMLHttpRequest 实例。可以通过以下代码来创建一个 XHR 对象：

var xhr = new XMLHttpRequest();

在这段代码中，我们使用 new XMLHttpRequest() 来实例化一个新的 XHR 对象，并将其赋值给变量 xhr。

XHR 对象的属性和方法

一旦创建了 XHR 对象，我们可以使用其属性和方法来发送请求和处理响应。以下是一些常用的 XHR 对象属性和方法：

• onreadystatechange: 一个事件处理程序，当 readyState 属性发生变化时被调用。
• readyState: 表示请求的状态，有五种取值，分别是 0（未初始化）、1（启动）、2（发送）、3（接收）、4（完成）。
• status: 表示响应的 HTTP 状态码，比如 200 表示成功，404 表示未找到等。
• responseText: 以字符串形式返回服务器响应的文本。
• open(method, url, async): 初始化一个请求，参数 method 表示请求的类型（GET 或 POST），url 表示请求的 URL，async 表示请求是否异步处理。
• send(data): 发送请求，参数 data 用于发送到服务器的数据。

示例代码

下面是一个简单的示例代码，演示了如何创建 XHR 对象，并发送一个 GET 请求：

var xhr = new XMLHttpRequest();
xhr.open('GET', 'https://api.example.com/data', true);
xhr.onreadystatechange = function() {
  if (xhr.readyState === 4 && xhr.status === 200) {
    console.log(xhr.responseText);
  }
};
xhr.send();

在这个示例中，我们创建了一个 XHR 对象，使用 open 方法初始化了一个 GET 请求，并在 onreadystatechange 事件处理程序中处理了服务器响应的数据。

这就是关于 XHR 创建对象的内容，下一节我们将讨论如何发送请求和处理响应数据。