javascript-ajax异步请求

scofield6666

已于 2022-05-31 15:08:44 修改

阅读量526

点赞数 1

文章标签： javascript ajax 浏览器对象异步

于 2015-04-27 15:53:54 首次发布

本文链接：https://blog.csdn.net/qq894492015/article/details/45311525

版权

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Ajax异步请求</title>
<script language="javascript" type="text/javascript">
function getInfo(){
var oxhr;//先创建一个对象，这里不多说
if(window.ActiveXObject){//老版本的 Internet Explorer （IE5 和 IE6）使用 ActiveX 对象：
oxhr = new ActiveXObject("Microsoft.XMLHTTP");//为避免IE内核的浏览器不支持 XMLHttpRequest 对象，这里我们创建 ActiveXObject
}else{
oxhr = new XMLHttpRequest();//对于支持的浏览器，直接创建XMLHttpRequest对象
}
//接下来就可以使用了
//当请求被发送到服务器时，我们需要执行一些基于响应的任务。
//所以，这里我们用到了AJAX 的 onreadystatechange 事件
oxhr.onreadystatechange = function(){
//每当 readyState 改变时，就会触发 onreadystatechange 事件。
//readyState 属性存有 XMLHttpRequest 的状态信息。
if(oxhr.readyState == 4 && oxhr.status == 200){
/*
readyState 存有 XMLHttpRequest 的状态。从 0 到 4 发生变化。
0: 请求未初始化
1: 服务器连接已建立
2: 请求已接收
3: 请求处理中
4: 请求已完成，且响应已就绪
status
200: "OK"
404: 未找到页面
*/
document.getElementById("box").innerHTML = oxhr.responseText;//打印出内容
}
}
oxhr.open("GET","info.txt",true);
/*
open(method,url,async) 规定请求的类型、URL 以及是否异步处理请求。
method：请求的类型；GET 或 POST
url：文件在服务器上的位置
async：true（异步）或 false（同步）
*/
oxhr.send();//将请求发送到服务器。
}
</script>
</head>
<body>
<h2>Hello Ajax</h2>
<input type="button" value="Click me" onClick="getInfo()"/>
<div id="box"></div>
</body>
</html>