ajax(asynchronous javascript and xml)
是一种用来改善用户体验的技术,其本质是利用浏览器提供的一种特殊的对象(XmlHttpRequest,也可称为ajax对象)向服务器发送异步请求。服务器返回部分数据(通常不需要返回完整页面),浏览器利用这些数据对当前页面做更新。整个过程,页面无刷新,不打断用户的操作。
异步请求:发送请求的同时,浏览器不会销毁当前页面,用户仍然可以对当前页面做其他操作。
如何获得ajax对象?
需考虑兼容性:
function getXhr(){
var xhr=null;
if(window.XMLHttpRequest){
xhr=new XMLHttpRequeat();
}else{
xhr = new ActiveXobject("Microsoft.XMLHttp");
}
return xhr;
}
ajax对象的几个重要的属性
onreadystatechange:用来绑定事件处理函数 ,用来处理readystatechange事件。
注:当ajax对象的readystate属性发生了任何改变(比如从0变成了1),就会产生readystatechange事件。
readystate:有五个值(0,1,2,3,4),表示ajax对象与服务器通信的状态,当值为4时,表示ajax已经成功获取服务器返回的数据。
responseTest:获得服务器返回的文本数据。
responseXML:获得服务器返回的xml数据。
status:获得状态码
编程步骤:
step1:获得ajax对象
比如:var xhr=getXhr();
step2:发送请求
发送get请求:
1.xhr.open(‘get’,’check_uname.do?uname=tom’,true);
2.xhr.onredystatechange=f1;
3.xhr.send(null);
注:
true:异步
false:同步(发送请求时,浏览器会锁定当前页面,用户不能够对当前页面做其他操作)
发送post请求
step3.编写服务器端的程序
注:通常不需要返回完整的页面,只需返回部分数据(文本)。
step4.编写事件处理函数
function f1(){
//先获得服务器返回的数据
if(xhr.readyState==4&&xhr.status==200){
var txt=xhr.responseText;
//利用这些数据更新页面
...
}
}
ajax
最新推荐文章于 2024-06-20 09:53:57 发布