ajax:异步JS和XML
使用ajax技术的网页,通过在后台服务器进行少量数据交换,就可以实现异步局部更新
XMLHttpRequest对象是浏览器提供的一个API,用来向服务器发送请求并解析服务器回应。
XMLHTTPRequest只是一个JavaScript对象,确切的说,是一个构造函数。它是特殊之处在于它是由客户端(即浏览器)提供的,而不是JavaScript原生的,除此之外,它有属性,有方法,需要通过new
关键字进行实例化。
XMLHTTPRequest实例的方法和属性
.open()
方法接收三个参数:请求方式,请求URL地址和是否为异步请求的布尔值。
.send()
方法的参数不可为空,也就是说,对于不需要发送任何数据的GET请求,也需要在调用.send()
方法时,向其传入null
值;而POST请求发送的数据会作为.send
方法的参数。
xhr实例中的readstatechange
事件会监听xhr.readystate
属性的变化,且当xhr.readystate == 4
时,表示已接收到全部响应数据。
一个异步的GET的请求:
1
2
3
4
5
6
7
8
9
10
11
12
const xhr = new XMLHttpRequest()
xhr.onreadystatechange = () => {
if(xhr.readystate == 4){
if((xhr.status >= 200 && xhr.status < 300) || xhr.status == 304){
alert(xhr.responseText)
}else{
alert("Request was unsuccessful:" + xhr.status)
}
}
}
xhr.open("get", "url", true)
xhr.send(null)