2.将状态触发器绑定到一个函数
3.使用open方法建立与服务器的连接
4.向服务器端发送数据
5.在回调函数中对返回数据进行处理
1.创建XMLHttpRequest对象:
不同浏览器提供不同的支持,IE浏览器 new ActiveXObject("Msxml2.XMLHTTP"),new new ActiveXObject("Microsoft.XMLHTTP"),其它浏览器(火狐) new XMLHttpRequest();
XMLHttpRequest的方法:
open(method,url, asynch) :建立对服务器的调用
send(content) :向服务器发送请求
XMLHttpRequest的属性:
onreadystatechange :状态回调函数
responseText/responseXML :服务器的响应字符串
status:服务器返回的HTTP状态码(200 =请求成功;404=请求失败......)
statusText: 服务器返回的HTTP状态信息
readyState :对象状态(0 = 未初始化;1 = 正在加载;2 = 已加载;3 = 交互中;4 = 完成)
一般都只用找到文档上代码复制代码就OK:
var xmlhttp;
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
2.将状态触发器绑定到一个函数:
xmlHttp.onreadystatechange = processor; 这里的processor是回调函数的方法名,当对象状态发生改变时,就会触发回调函数,触发回调函数这里当做最后一步。
xmlHttp.onreadystatechange = processor;
function processor (){
… …
}
3.使用open方法建立与服务器的连接:
open(method,url, asynch) 其中method表示HTTP调用方法,一般使用"GET","POST"; url表示调用的服务器的地址 ; asynch表示是否采用异步方式,true表示异步,一般这个参数不写。
xmlHttp.open("POST", "url"); xmlHttp.open("GET", "url?name=xxx&pwd=xxx");//get提交方式,url后面可以带参数,post提交方式参数放在接下来要讲的send方法里面
4.向服务器端发送数据:
用get提交方式:
//3.使用open方法建立与服务器的连接 xmlhttp.open("GET","url?name=xxx&pwd=xxx");
//4.发送请求
send xmlhttp.send(null);
用post提交方式:
//3.使用open方法建立与服务器的连接 xmlhttp.open("POST",URL); xmlhttp.setRequestHeader("content-type","application/x-www-form-urlencoded");//设置请求头,这个在post提交方法中要多写的代码 //4.发送请求 xmlhttp.send("name=xxx&pwd=xxx");
5.在回调函数中对返回数据进行处理:
//2.将状态触发器绑定到一个函数
xmlhttp.onreadystatechange= processor;
function processor(){
//5.处理响应数据 当信息全部返回,并且是成功
if(xmlhttp.readyState==4&&xmlhttp.status==200){
}
};
一个完整的例子:
//第一步:得到XMLHttpRequest对象. var xmlhttp = null; if (window.XMLHttpRequest) { xmlhttp = new XMLHttpRequest(); //针对于现在的浏览器包括IE7以上版本 } else if (window.ActiveXObject) { //针对于IE5,IE6版本 xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); } //2.设置回调函数 xmlhttp.onreadystatechange=function(){ //5.处理响应数据 当信息全部返回,并且是成功 if(xmlhttp.readyState==4&&xmlhttp.status==200){ alert(xmlhttp.responseText); } }; //3.open xmlhttp.open("GET",URL); //4.发送请求 send xmlhttp.send(null);