原生js详解ajax请求

前端请求服务端资源利用ajax进行请求，通常可以借助jquery等第三方库完成ajax的请求，此处将详解原生ajax请求：

var xhr = new XMLHttpRequest()
xhr.open('GET','./api',false)
xhr.onreadystatechange = function(){
  // 异步执行
  if(xhr.readyState == 4){
    if(xhr.status == 200){
      console.log(xhr.responseText)
    }
  }
}
xhr.send(null)

上述代码是原生js完成ajax请求原理。

xhr.readyState有5个状态值：

0-（未初始化）还没有调用send()方法；

1-（载入）已调用send()方法，正在发送请求；

2-（载入完成）send()方法执行完成，已经接收到全部相应内容；

3-（交互）正在解析响应内容；

4-（完成）响应内容解析完成，可以在客户端调用。

xhr.status有4个状态值：

2xx - 表示成功处理请求。如200；

3xx - 需要重定向，浏览器直接跳转；

4xx - 客户端请求错误，如404；

5xx - 服务端错误。

以上，原生js ajax请求的具体内容。本文结。