AJAX 是什么
ajax 是一种异步请求数据的技术，对于提高用户体验度和程序性能有很大的帮助。
AJAX 请求步骤
- 创建
ajax核心对象XMLHttpRequest
let xmlHttp;
if (window.XMLHttpRequest) {
xmlHttp = new XMLHttpRequest;
} else {
xmlHttp = new ActiveXObject('Microsoft.XMLHttp'); // IE5、6执行此代码
}
- 向服务器发送请求
xmlHttp.open(method, url, async);
xmlHttp.send();
- method: 请求的类型
- url：文件在服务器上的位置，相对位置或者是绝对位置
- async：true（异步）或者false（同步）
注意：
-
async用于表示该请求是否异步处理，默认是true，所以一般不会写 -
post请求不同于get请求，send(string)方法post请求时才使用字符串参数，否则不用带参数 -
post请求一定要设置请求头的格式内容
xmlHttp.open('POST', 'ajax+test.html', true);
xmlHttp.setRequestHeader('content-type', 'application/x-www-form-urlencoded');
xmlHttp.send('fname=Herry&lname=Ford');
-
服务器详情处理
responseText 获得字符串形式的相应数据
responseXML 获得 XML 像是的相应数据
3.1 同步处理xmlHttp.open('GET', 'http://www.we.com/fight/win.php', false); xmlHttp.send(); document.getElsementById('tes-box').innerHtml = xmlHttp.responseText;3.2 异步处理
异步处理比较麻烦，要在请求状态事件中处理。xmlHttp.onreadystatechange = () => { if (xmlHttp.readyState === 4 && xmlHttp.status === 200) { document.getElementById('text-box').innerHtml = xmlHttp.responseText; } }一共有五种请求状态：
- 0：请求未初始化
- 1：服务器链接已建立
- 2：请求已接收
- 3：请求处理中
- 4：请求已完成，且相应已就绪 .
xmlHttp.status：响应状态码。
- 200：'OK'
- 304：该资源在上次请求之后没有任何修改（通常用于浏览器的缓存机制，使用 'GET' 请求时尤其需要注意）
- 403：（禁止）服务器拒绝请求
- 404：（未找到）服务器找不到请求的网页
- 408：（请求超时）服务器等候请求时发生超时
- 500：（服务器内部错误）服务器遇到错误，无法完成请求
