原生AJAX

1、创建XHR对象

var xmlhttp =new XMLHttpRequest();
所有现代浏览器 (IE7+、Firefox、Chrome、Safari 以及 Opera) 都内建了 XMLHttpRequest 对象。
通过一行简单的 JavaScript 代码，我们就可以创建 XMLHttpRequest 对象。
创建 XMLHttpRequest 对象的语法：
xmlhttp=new XMLHttpRequest();
老版本的 Internet Explorer （IE5 和 IE6）使用 ActiveX 对象：
xmlhttp=new ActiveXObject(“Microsoft.XMLHTTP”);

2、设置响应函数

XHR对象的作用是和服务器进行交互，所以既会发消息给服务器，也能接受服务器返回的响应。
Xmlhttp.onreadystatechange = checkResult，就可以指定用checkResult 函数进行处理。

3、设置并发出请求

通过open函数设置背后的这个小线程，将要访问的页面url ，
xmlhttp.open(“GET”,url,true);
通过send函数进行实际的访问
xmlhttp.send(null);
null表示没有参数，因为参数已经通过“GET" 方式，放在url里了。
只有在用"POST"，并且需要发送参数的时候，才会使用到send。
类似这样：
xmlhttp.send(“user=”+username+"&password="+password)
为什么使用 Async=true ？
我们的实例在 open() 的第三个参数中使用了 “true”。
该参数规定请求是否异步处理。
True 表示脚本会在 send() 方法之后继续执行，而不等待来自服务器的响应。
onreadystatechange 事件使代码复杂化了。但是这是在没有得到服务器响应的情况下，防止代码停止的最安全的方法。
通过把该参数设置为 “false”，可以省去额外的 onreadystatechange 代码。如果在请求失败时是否执行其余的代码无关紧要，那么可以使用这个参数。

4、处理响应信息

在checkResult 函数中处理响应
function checkResult(){
if (xmlhttp.readyState== 4 && xmlhttp.status==200)
document.getElementById(‘checkResult’).innerHTML=xmlhttp.responseText;
}
http.readyState 4 表示请求已完成
xmlhttp.status 200 表示响应成功
xmlhttp.responseText; 用于获取服务端传回来的文本

部分内容参考自https://how2j.cn/