ajax处理全过程总结

前端之家收集整理的这篇文章主要介绍了ajax处理全过程总结前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
function getXmlHttpRequest(){
var xhr=null;
if((typeof XMLHttpRequest)!='undefined'){
xhr=new XMLHttpRequest();
}else{
xhr=new ActiveXObject('Microsoft.XMLHttp');
}
return xhr;
}

一、获取XmlHttpRequest对象

二、发送请求(to server)

1、get请求

var xhr = getXmlHttpRequest(); /* open(请求方式,请求地址,同步/异步) * 请求方式: get/post * 请求地址:如果是get请求,请求参数添加到地址乊后。 * 比如 check_user.do?username=zs * 同步/异步:true表示异步。*/ xhr.open('get','check_user.do',true); /* 注册一个监听器(即当xhr的状态发生改变产生了readystatechange事件, * 该事件会由f1函数来处理。我们需要在f1函数里面获得服务器返回的数据, * 然后更新页面) */ xhr.onreadystatechange=f1; /* 只有调用send方法乊后,请求才会真正发送 */ xhr.send(null);


2、post请求

var xhr = getXmlHttpRequest(); xhr.open('post','check_username.do',true); //必须添加一个消息头content-type xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded"); xhr.onreadystatechange=f1; xhr.send('username=xiaoming');


三、服务器处理请求


四、处理服务器的响应

xhr.onreadystatechange=f1; function f1(){ //。。。}
或者

xhr.onreadystatechange=function(){ //编写相应的处理代码 if(xhr.readyState == 4){ //只有readyState等亍4,xhr才完整地接收到了服务器返回的数据。 //获得文本数据 var txt = xhr.responseText; //获得一个xml dom对象。 var xml = xhr.responseXML; //dom操作、更新页面 } };

猜你在找的Ajax相关文章