1. 创建 XMLHttpRequest 对象：
使用 new XMLHttpRequest() 创建一个 XMLHttpRequest 对象。这个对象提供了一种在客户端和服务器之间进行数据交换的方法。
var xhr = new XMLHttpRequest();
2. 初始化请求：
使用 xhr.open(method, url, async) 方法初始化请求。这个方法接受三个参数：
- method: 请求使用的 HTTP 方法，如 "GET" 或 "POST"。
- url: 请求的 URL。
- async: 是否异步执行，默认为 true。
xhr.open('GET', 'https://example.com/data', true);
这里，我们初始化了一个使用 GET 方法的异步请求。
3. 设置回调函数：
使用 xhr.onreadystatechange 属性设置一个回调函数，该函数在 readyState 属性改变时被调用。readyState 表示请求的状态，其中 4 表示完成。
xhr.onreadystatechange = function() {
if (xhr.readyState === 4) {
// 在这里处理响应
}
};
4. 发送请求：
使用 xhr.send() 方法发送请求。如果是 GET 请求，可以将参数放在 URL 中；如果是 POST 请求，可以在 send 方法中传递参数。
xhr.send();
综合起来，以下是创建 XMLHttpRequest 对象和初始化请求的完整示例：
var xhr = new XMLHttpRequest();
xhr.open('GET', 'https://example.com/data', true);
xhr.onreadystatechange = function() {
if (xhr.readyState === 4) {
if (xhr.status === 200) {
// 在这里处理响应
console.log(xhr.responseText);
} else {
// 处理错误
console.error('Request failed with status:', xhr.status);
}
}
};
xhr.send();
这是一个基本的 AJAX 请求的结构。在实际应用中，你会根据需要配置其他参数，例如设置请求头、处理请求超时等。在现代的开发中，也可以考虑使用 Fetch API 替代 XMLHttpRequest，以获得更简洁和功能强大的 API。
转载请注明出处：http://www.zyzy.cn/article/detail/4589/Ajax