项目中关于AJAX的使用总结

2021-05-16 19:28

阅读:692

YPE html>

标签:执行   用例   else   activex   服务   总结   2.x   关于   object   

一、使用情况:AJAX 是与服务器交换数据并更新部分网页的艺术,在不重新加载整个页面的情况下使用。AJAX的核心:向服务器发送多个请求而无需用户等待来至服务器的响应。

二、AJAX的优势
    1.异步加载数据,无需切换页面,不需要刷新
    2.更佳的用户体验:局部刷新、及时验证、操作步骤简化等
    3.节省流量
    4.JS控制数据的加载,更加灵活多用
三、是用步骤:
    1.new XMLHttpRequest()
    2.open
    3.send
    4.onreadystatechange
    5.responseText
例子:(注意:要在服务器上运行)

Document

四、readyState的常用的几种状态:

 

0:请求未初始化(还没有调用 open())。

1:请求已经建立,但是还没有发送(还没有调用 send())。

2:请求已发送,正在处理中(通常现在可以从响应中获取内容头)。

3:请求在处理中;通常响应中已有部分数据可用了,但是服务器还没有完成响应的生成。

4:响应已完成;您可以获取并使用服务器的响应了。

 

1**:请求收到,继续处理

2**:操作成功收到,分析、接受

3**:完成此请求必须进一步处理

4**:请求包含一个错误语法或不能完成

5**:服务器执行一个完全有效请求失败

 

200 请求成功    

301 所请求的页面已经转移至新的url 

302 所请求的页面已经临时转移至新的url  

304 文档未修改原来缓冲的文档还可以继使用

400 服务器未能理解请求  

404 服务器无法找到被请求的页面 

500 请求未完成。服务器遇到不可预知的情况 

502 网关错误

 

请求成功条件

readyState==4&&status>200&&status

 

五、为了以后能更方便地使用,可以把ajax封装成一个js函数,如:

function fnAjax(url,succFn,faildFn){
if (window.XMLHttpRequest){
var ajax=new XMLHttpRequest();
}
else{
var ajax=new ActiveXObject("Msxml2.XMLHTTP");
}
ajax.open("get",url,true);
ajax.send();
ajax.onreadystatechange=function (){
if (ajax.readyState==4){
if (ajax.status>=200&&ajax.statussuccFn(ajax.responseText);
}
else{
faildFn();
}
}
}
}

六、函数的使用例子:

Document

我是a1

项目中关于AJAX的使用总结

标签:执行   用例   else   activex   服务   总结   2.x   关于   object   

原文地址:http://www.cnblogs.com/liyuspace/p/7746886.html


评论


亲,登录后才可以留言!