0%

JS 实现 AJAX

其实写这篇文章是没有必要的,因为 MDN 已经写得非常详细了:**MDN - AJAX**

关于 AJAX

AJAX 是异步的 JavaScript 和 XML(Asynchronous JavaScript And XML)。简单点说,就是使用 XMLHttpRequest 对象与服务器通信。 它可以使用 JSON,XML,HTML 和 text 文本等格式发送和接收数据。AJAX 最吸引人的就是它的“异步”特性,也就是说它可以在不重新刷新页面的情况下与服务器通信,交换数据,或更新页面。

简单实现

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
// 构建请求体
let httpRequest = new XMLHttpRequest();
// 设置header
httpRequest.setRequestHeader('Content-Type', 'application/json');
// 监听响应事件
httpRequest.onreadystatechange = () => {
// 对响应数据进行判断
if (httpRequest.readyState === XMLHttpRequest.DONE) {
// 返回状态码判断
if (httpRequest.status === 200) {
// 数据处理
var response = JSON.parse(httpRequest.responseText);
alert(response.computedString);
} else {
alert('There was a problem with the request.');
}
}
};
// 发起请求 第一个参数是请求方式,第二个参数是请求地址,第三个参数是请求是异步的还是同步的
httpRequest.open('GET', url, true);
// 发起请求
httpRequest.send();