AJAX的请求步骤
（1）创建异步对象XMLHttpRequest
（2）请求数据准备，设置请求参数（请求的方法、路径）：调用XMLHttpRequest对象的open方法
1）（无参）get方法send的参数为null
2）（有参）post方法send的参数为路径，需要在发送之前设置请求头对参数进行解析
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
（3）发送：调用XMLHttpRequest对象的send方法
（4）检测服务器状态：为XMLHttpRequest对象增加onreadyStatechange函数，对服务器状态进行检测（当状态值readyState等于4，状态码status等于200则说明服务器正常运行并返回响应数据）
1）是否完成：XMLHttpRequest对象的readyState==4
2）是否可用：XMLHttpRequest对象的status==200
readyState（状态值）有五种可能的值：
0 (未初始化)： (XMLHttpRequest)对象已经创建，但还没有调用open()方法。
1 (载入)：已经调用open() 方法，但尚未发送请求。
2 (载入完成)： 请求已经发送完成。
3 (交互)：可以接收到部分响应数据。
4 (完成)：已经接收到了全部数据，并且连接已经关闭。
status（状态码）检测的是服务器的处理状态 https://www.runoob.com/http/http-status-codes.html
状态码是由3个数字组成，分别表示不同状态类型（5种）
1. 1XX 表示服务器正在处理中；
2. 2XX 表示请求成功，比如200；
3. 3XX 重定向，表示请求不成功，客户必须采取处理方式；304 303
4. 4XX 客户端错误，表示请求的地址或者文档不存在，比如404；
5. 5XX 服务端或者后台出现问题，比如500,503……
（5）响应主体返回的文本：XMLHttpRequest对象的reponseText属性
实例
一、原生方法（常考）
1、get方法进行AJAX请求
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<p>userName: <input type="text" name="" id="username"></p>
<p>password: <input type="password" name="" id="password"></p>
<button id="login">登录</button>
<p id="txt"></p>
<script>
login.οnclick=function(){
var xhr=new XMLHttpRequest();
xhr.open('get','test.php?user='+username.value+'&pass='+password.value);
xhr.send(null);
xhr.onreadystatechange=function(){
if (xhr.readyState==4) {
if (xhr.status==200) {
txt.innerHTML=xhr.responseText;
}
}
}
}
</script>
</body>
</html>