XMLHttpRequest
是 JavaScript 中的一个对象,用于在浏览器中创建异步 HTTP 请求。它允许你与服务器进行数据交互,而无需重新加载整个页面。这在很多现代 Web 应用中非常有用,因为它提供了更好的用户体验和更快的响应时间。
以下是 XMLHttpRequest
对象的一些主要方法和属性:
open(method, url, async)
: 打开一个新的 HTTP 请求。method
是请求方法(如 “GET” 或 “POST”),url
是请求的 URL,async
是一个布尔值,表示请求是否应该异步执行。
send(data)
: 发送 HTTP 请求。如果 method
是 “POST”,则可以将 data
作为请求体发送。否则,data
通常为空。
onreadystatechange
: 当请求的状态发生变化时,会触发此事件。你可以通过检查 readyState
属性的值来确定请求的当前状态(如 0、1、2、3 或 4)。
status
: 返回的 HTTP 响应的状态码。例如,200 表示成功,404 表示未找到资源等。
responseText
或 responseXML
: 返回的 HTTP 响应的内容。responseText
是纯文本格式,而 responseXML
是 XML 格式。
以下是一个简单的示例,展示了如何使用 XMLHttpRequest
对象从服务器获取数据:
// 创建一个新的 XMLHttpRequest 对象
var xhr = new XMLHttpRequest();
// 设置请求方法和 URL
xhr.open("GET", "https://api.example.com/data", true);
// 设置请求完成时的回调函数
xhr.onreadystatechange = function() {
// 检查请求是否完成(readyState 为 4)且成功(状态码为 200)
if (xhr.readyState === 4 && xhr.status === 200) {
// 将响应文本解析为 JSON 对象
var data = JSON.parse(xhr.responseText);
// 在控制台中显示获取到的数据
console.log(data);
}
};
// 发送请求
xhr.send();
这个示例展示了如何使用 XMLHttpRequest
对象发起一个异步 GET 请求,并在请求成功时处理返回的 JSON 数据。类似地,你可以使用 POST
方法发送包含数据的请求,并根据需要处理返回的数据格式(如 XML、JSON 等)。