AJAX概述
1、AJAX的定义：异步的JS和XML，使用XMLHttpRequest对象与服务器通信；可以在不重新刷新页面的情况下与服务器通信，交换数据或更新页面。
2、概念：AJAX是浏览器与服务器进行数据通信的技术。
3、工作原理：客户端发送请求交给xhr，xhr把请求提交给服务器进行处理，服务器响应数据交给xhr对象，xhr对象接收数据，最后由javascript把数据写到页面上
4、AJAX请求步骤：①创建XMLHttpRequest实例②发送HTTP请求③接收服务器传回的数据④更新网页数据
（AJAX只能向同源网址（协议域名端口相同）发出HTTP请求，否则会报错）
XMLHttpRequest对象
1、XMLHttpRequest对象是AJAX的主要接口；XMLHttpRequest本身是一个构造函数，没有任何参数
2、readyState: 返回请求的状态。可能的值有：
-
0: 对象已创建，但尚未调用 open() 方法。
-
1: open() 方法已被调用。
-
2: send() 方法已被调用，请求已发出。
-
3: 服务器正在发送响应数据。
-
4: 服务器响应已完全接收。
-
var xhr = new XMLHttpRequest(); if (xhr.readyState === 4) { // 请求结束，处理服务器返回的数据(表示发出的HTTP请求已经成功) } else { // 显示提示“加载中……” }
3、responseText: 将响应的文本内容作为字符串返回。
4、responseXML: 如果响应的内容类型是 "text/xml" 或 "application/xml"，则将响应作为 XMLDocument 对象返回。
5、status: 返回 HTTP 状态码，只有2xx和304的状态码表示成功。
6、statusText: 返回 HTTP 状态文本，例如 "OK" 或 "Not Found"。
7、responseURL: 属性是字符串，表示发送数据的服务器的网址
var xhr = new XMLHttpRequest();
xhr.open('GET', 'http://example.com/test', true);
xhr.onload = function () {
// 返回 http://example.com/test
console.log(xhr.responseURL);
};
xhr.send(null);
方法
- open(method, url, async, user, password): 初始化请求参数。
method: 请求方法（GET, POST, PUT, DELETE 等）。url: 请求的 URL。async: 是否异步发送请求，默认为true。user: 可选的用户名用于身份验证。password: 可选的密码用于身份验证。
- send(data): 发送请求。如果请求是 POST 类型，那么
data将作为请求主体发送。 - setRequestHeader(header, value): 设置请求的 HTTP 头部信息。
- abort(): 取消当前请求。
- getAllResponseHeaders(): 返回所有响应头信息。
- getResponseHeader(header): 返回特定响应头的信息。
事件
1、onreadystatechange：
- 当 readyState 改变时会触发此事件。
2、onloadstart：
- 当请求开始加载时触发。
3、onprogress：
- 当请求接收到数据时触发。
4、onabort：
- 当请求被取消时触发。
5、onerror：
- 当请求遇到错误时触发。
6、onload：
- 当请求成功完成时触发。
7、ontimeout：
- 当请求超时时触发。
8、onloadend：
- 当请求结束时触发（无论请求成功还是失败）。