关于ajax:ajax的核心APIXMLHttpRequest

繁难的 ajax

get 申请

//get 申请
const xhr = new XMLHttpRequest()
xhr.open("GET","/api",false)//false 示意申请形式为异步
xhr.onreadystatechange = function () {if(xhr.readyState === 4){if(xhr.status === 200){console.log(JSON.parse(xhr.responseText))// 转化成 json 格局
        }
    }
}
xhr.send(null)

post 申请

const xhr = new XMLHttpRequest()
xhr.open("POST","/login",false)
xhr.onreadystatechange = function () {if(xhr.readyState === 4){if(xhr.status === 200){console.log(JSON.parse(xhr.responseText))
        }
    }
}

const postData = {
    username:'张三',
    password:'123456'
}
xhr.send(JSON.stringify(postData))// 发送字符串 

xhr.readyState 状态

• 0-（未初始化）还没有调用 send() 办法
• 1-（载入）已调用 send() 办法，正在发送申请
• 2-（载入实现）send() 办法执行实现，曾经接管到全副响应内容
• 3-（交互）正在解析响应内容
• 4-（实现）响应内容解析实现，能够在客户端调用

xhr.status

• 2xx- 示意胜利解决申请，如 200
• 3xx- 重定向，浏览器间接跳转，如 301（永恒重定向），302（长期重定向），304（资源未扭转）
• 4xx- 客户端申请谬误，如 404（申请地址有谬误），403（客户端没有权限）
• 5xx- 服务器端谬误