1:创建对象
A:基本写法
var xhr=new Activexobject("Microsoft.XMLHTTP");//早期ie6
var xhr=new XMLHttpRequest();//标准浏览器
B:兼容写法
a:方法一
var xhr=null;
if(window.XMLHttpRequest){
xhr=new XMLHttpRequest();//标准浏览器
}else{
xhr=new ActiveXobject("Microsoft");//早期ie6
}
b:方法二
try{
xhr=new XMLHttpRequest();//标准浏览器
}else{
xhr=new ActiveXobject("Microsoft");//早期ie6
}
2:准备发送
xhr.open('get','02get.php',true);
参数一:请求方式
get:获取数据 如果时get请求那么参数必须在url中进行传递
xhr.open('get','02get.php?username='+uname'&password='+pw,true);
注意点:在ie浏览器中可能会出现乱码所以要对传递的参数进行编码操作
使用encodeURI()可以防止乱码
var param='username='+uname'&password='+pw;
xhr.open('get','02get.php?'+encodeURI(param),true);
post:提交数据
post请求参数在send()中传递,并且不需要转码
但必须设置请求头信息
xhr.open('post','02get.php',true);
参数二:请求地址
参数三:同步或者异步标志位
true:表示异步(默认值)
false:表示同步
3:执行发送动作
get请求参数
xhr.send(null);//get请求这里需要添加null参数
注:get请求这里需要添加null参数
post请求参数
var param='username='+uname'&password='+pw;
xhr.setRequestHeader("content-Type","application/x-www-form-urlencode");//固定不变的格式
xhr.send(param);//post请求参数在这里传递,并且不需要转码
4:指定回调函数
xhr.onreadystatechange=function(){
if(xhr.readyState==4){//数据解析完成,可以使用了。但数据不一定是正常的
if (xhr.status==200) {//表示数据是正常的
alert(xhr.tesponseText);
}
}
}
执行有浏览器来调用的。该函数调用的条件就是readyState状态发生改变(不包括从0变到1)
A:readyState
readyState==0;表示xhr对象创建完成
readyState==1;表示已经发送了请求
readyState==2;表示浏览器已经收到了服务器响应的数据(还没有解析)
readyState==3;表示正在解析数据
readyState==4;数据解析完成,可以使用了。但数据不一定是正常的
A:state http常见状态码
status==200 表示响应成功
status==404 没有找到请求的资源
status==500 服务端错误