原生js处理ajax请求Ajax异步请求--readyState

 可直接引用为.js

//Ajax文件地址，文件读取成功，文件读取失败
function ajax(url, fnSuc, fnFai) {
    let oAjax = new XMLHttpRequest()
    oAjax.open('POST', url, true)
    oAjax.send()
    oAjax.onreadystatechange = function() {
        //读取完成
        if (oAjax.readyState == 4) {
            //成功
            if (oAjax.status == 200) {
                fnSuc(oAjax.responseText)
            } else {
                //失败处理
                if (fnFai) {
                    fnFai(oAjax.status)
                }
            }
        }
    }
}

 

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

xhr.readyState有5个状态值：

•  - （未初始化）还没有调用send()方法；
•  - （载入）已调用send()方法，正在发送请求；
•  - （载入完成）send()方法执行完成，已经接收到全部相应内容；
•  - （交互）正在解析响应内容；
•  - （完成）响应内容解析完成，可以在客户端调用。

xhr.status有4个状态值：

•  - 表示成功处理请求。如200； 
• - 需要重定向，浏览器直接跳转；
•  - 客户端请求错误，如404；
•  - 服务端错误。

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

可直接引用为.js