<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>AJAX获取响应状态码与数据处理</title>
</head>
<body>
<h1>AJAX获取响应状态码与数据处理</h1>
<input type="button" value="获取响应数据" onclick="get_data()">
<script>
function get_data() {
// 创建xhr对象
let xhr = new XMLHttpRequest()
// 设置请求的方式与请求地址
xhr.open('get','http://httpbin.org/get')
// 发送请求
xhr.send()
//获取服务器响应
// 只会打印2、3之后的数据,因为0、1代表open还没被调用的时候,主要看onreadystatechange的位置
xhr.onreadystatechange = () =>{
//判断ajax状态码是否为4:获取ajax状态码方式xhr.readyState
if (xhr.readyState == 4){//状态码为4代表完全接收到服务器响应,但是不代表一定成功,也可以是失败
// 判断Http状态码是否为400 ,正常响应数据(成功)
if (xhr.status == 200){
//console.log(xhr.responText)
// 将数据转换成json类型
data = JSON.parse(xhr.responseText)
console.log(data);
}else{
// 如果没用正常做出处理打印他的Http状态码
console.log(xhr.status)
}
}else{
console.log(xhr.readyState);
}
}
}
</script>
</body>
</html>
123.AJAX_获取状态码并处理响应
最新推荐文章于 2024-07-14 03:33:08 发布
关键词由CSDN通过智能技术生成