AJAX异步交互代码

前端小米粥

已于 2022-06-01 10:44:51 修改

阅读量289

点赞数 1

文章标签： ajax javascript 前端

于 2022-06-01 09:54:35 首次发布

本文链接：https://blog.csdn.net/zhouzhou69/article/details/125078133

版权

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Document</title>

<style></style>

</head>

<body>

<script>

//1.创建异步对象：创建XMLHttpRequest对象

//兼容性的创建对象，在非低版本IE下存在window.XMLHttpRequest属性

if(window.XMLHttpRequest){

//非低版本IE浏览器会执行以下这句代码

var xhr=new XMLHttpRequest()

}else{

//IE5 IE6浏览器会执行以下这句代码

var xhr=new ActiveXObject("Microsoft.XMLHTTP")

}

//2.创建请求

xhr.open("POST","http://192.168.124.18:7001/demo/get",true)

//3.发送异步请求

xhr.send();

//4.创建监听，接收响应，等待结果
//以下可以放到open()前

xhr.onreadystatechange=function(){

//监听readystate已经到了第四步的时候再接收数据

if(xhr.readyState==4){

//除了readystate==4之外还要看后台是否接通，给你的返回状态码是什么,状态码要在200～300之间，不包含300

if(xhr.status>=200 && xhr.status<300 || xhr.status===304){

//后台的返回是正常的并且是同意的

//状态码返回OK数据正常接收

var result=xhr.responseText;

console.log(result);

}else{

//后台返回不正常，如500，404等非成功状态

alert("返回失败")

}

}

}

</script>

</body>

</html>