古老的Ajax
Ajax:
1.创建一个对象:
let xhr = new XMLHttpRequest()
2.配置这个对象(调用open()的方法)
//第一个参数为请求的类型、第二个参数为请求的URL,第三个参数为是否异步发送的布尔值
xhr.open('GET',`/marvel/api/checkuser.php?username=${user}`,true)
3.准备接受响应(readystate是对象xhr的一个属性,在这里我们利用事件监听这个属性的状态的改变)
xhr.onreadystatechange = function() {
//当readyState发生了变化,会触发该事件。
xhr.readyState ===0 ===>xhr这个对象刚创建,但是没有调用
xhr.readyState ===1 ===>对象调用了,但是没有send
xhr.readyState ===2 ===> 对象调用了send,但是没有返回响应
xhr.readyState ===3 ===>对象收到了部分响应
xhr.readyState ===4 ===>收到了全部的响应
//我们对数值进行判断,如果!=4,就return
if(xhr.readyState !=4) {
return
}
//如果xhr这个对象的属性readyState ===4;服务器已经给出了全部的响应。但是我们还需要进一步去判断浏览器的相应结果,也就是响应的状态码。这个状态码放置在xhr.status中,当状态码在[200,300)之间,我们就可以认为其响应成功。
if(xhr.status >=200 &&xhr.status < 300) {
//响应成功,我们需要取得响应的数据,放在对象xhr的responseText中.
alert(xhr.responseText)
}else{
//响应失败
}
}
//4.发送请求
xhr.send()
change
【另需要注意的是ajax是不支持后端请求重定向的】