XHR创建对象
1.Ajax-创建-XMLHttpRequest对象
var xmlhttp = new XMLHttpRequest();
//老版本IE5,IE6使用ActiveX对象
var xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
为了应对现在所有的浏览器:
var xmlhttp;
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Msxml2.XMLHTTP");
}
2.AJAX-向服务器发送请求
XMLHttpRequest对象用于和服务器交换数据
xmlhttp.open("GET","test",true);
xmlhttp.send(null);
方法 | 描述 |
---|---|
open(method,url,async) | 规定请求的方式,URL,同步或异步(默认true异步) |
send(string) | 将请求发送到服务器,string仅用于post请求方式 |
get方式下的url 请求数据以问号隔开,例如:
xmlhttp.open("GET","ajax?name=zhangsan",true);
xmlhttp.send(null);
//异步和同步的解释,例如
同步时:
//同步时
xmlhttp.open("get","ajax",false);
xmlhttp.send(null);
alert("我会继续执行下去,不等xmlhttp接收到服务器请求");
// 如上字符串 请求发给服务器JavaScript继续执行,不等响应信息
异步时:
xmlhttp.open("GET","ajax?name=zhangsan",true);
xmlhttp.send(null);
//异步和同步的解释,例如
//同步时
xmlhttp.open("get","ajax",false);
xmlhttp.send(null);
alert("我会等xmlhttp接收到响应数据,再弹出来");
响应的参数
属性 | 描述 |
---|---|
xmlhttp.responseText | 获得字符串形式的响应数据 |
xmlhttp.responseXML | 获得 XML 形式的响应数据 |
onreadystatechange事件
当请求发送到服务器时,我们需要执行一些基于响应的任务
每当readystate 改变时,就会触发onreadystatechange事件
readystate属性中存有 XMLHttpRequest的状态信息。
属性 | 描述 |
---|---|
readystatechange() | 函数名,每当readystate改变时就会调用 |
readyState | 存放状态信息,从0~4发生变化 0.初始化 1.与服务器建立连接,2.请求已接收,3.请求处理中,4.请求完成,且响应就绪 |
status | 返回的状态 200 (正常) 400(未找到) |