jsjqueryajax的几种用法总结(及优缺点介绍)
这篇文章,是我不知道什么是ajax到熟练运用ajax的一个历程。
一,最原始的方式来运用ajax
<SCRIPTlanguage=javascript>
varxmlHttp;
functioncreateXMLHttpRequest(){
if(window.ActiveXObject){
xmlHttp=newActiveXObject("Microsoft.XMLHTTP");
}elseif(window.XMLHttpRequest){
xmlHttp=newXMLHttpRequest();
}
}
//定义了一个ajax的入口函数,供用view层用户调用
functionshow_type(type_id){
//alert(id);
createXMLHttpRequest();
varurl="../ajax/shop_type_status.php?id="+type_id+"&time="+Math.random();
xmlHttp.open("GET",url,true);
xmlHttp.onreadystatechange=function(){show_back();}
xmlHttp.send(null);
}
//回调函数,将从调用的php文件中取得的数据,反还给用户
functionshow_back(){
if(xmlHttp.readyState==4){
if(xmlHttp.status==200){
//document.getElementById("cat_id").value=id;
document.getElementById("type_status").innerHTML=xmlHttp.responseText;
}
}
}
</SCRIPT>
个人分析:这种方法挺好的,简单灵活,但是有一点不好,就是冗余代码比较多,不利于后期维护。
二,js端封装的ajaxrequest
这个东西,对于习惯了用javascript的人来说,是一个不错的选择,它是装上面所说的那种方法简单的封装了一下,做了统一的调用。感觉不错,代码挺多的就不贴出来了,大家可以到google搜ajaxrequest。
//ajaxrequest.js里面有一个这个方法这个方法是供view端调用的接口,接口可以有多个,根据情况自己加
functionajax_action_fun(url,fun){
varajax=newAJAXRequest;
ajax.get(
url,
function(obj){alert(obj.responseText);fun()}
);
}
//html里面调用这个接口
get_shop_son_list //是回调后执行的方法名
ajax_action_fun("../ajax/shop_ajax.php?type=1",get_shop_list);
functionget_shop_list(resValue){
//这里就是你要的操作
}
javascript:如果我想调用ajax_action_fun这个方法我要在html里加个东西
<aclass="showshop"href="javascript:"onclick=ajax_action_fun("../ajax/shop_ajax.php?type=1",get_shop_list);>显示店</a>
jquery:用它可以尽量把js和html分开,这对于后期维护是很帮助的,会节省很多时间,例如,全站换html;
$(".showshop").bind("click",{url:"../ajax/shop_ajax.php?type=1",function:get_shop_list},ajax_action_fun);
这样就可以不用在html里面写onclick事件了
三,jquery的ajax
1)
$.ajax({
type:"POST",
url:"test.php", //调用的php文件
data:"name=zhang",
success:function(msg){ //回调函数
alert("DataSaved:"+msg); //这里是操作
}
});
2)
//调用test.php文件,传个参数,data是返回的数据
$.post("test.php",{name:"zhang"},
function(data){
alert("DataLoaded:"+data);
});
相关文章
- SAP UI5 sap.ui.Device.media 公有方法介绍
- C++精通之路:map和set的介绍和有关oj题
- SAP 电商云 Spartacus UI UrlMatcherService 的用法介绍
- Easyrecovery16数据恢复软件使用教程及恢复原理介绍
- 【勒索专题】勒索病毒基本介绍
- pgsql之create user与create role的区别介绍
- oracle中左填充(lpad)和右填充(rpad)的介绍与用法
- Oracle CASE WHEN 用法介绍详解数据库
- MySQL中IF函数的使用方法介绍(mysql中if函数用法)
- log日志文件的作用和用法MySQL中的binlog是一种二进制日志文件,可以用于日志记录和数据恢复本文介绍了binlog日志文件的作用和用法
- response.setHeader参数、用法的介绍
- JQuery中$之选择器用法介绍
- Tomcat集群和Session复制应用介绍
- jquery层次选择器siblings与nextAll的区别介绍
- js中substring和substr的详细介绍与用法
- C++中strtok()函数的用法介绍
- C++流操作之fstream用法介绍
- c#各种Timer类的区别与用法介绍
- C#线程池用法详细介绍
- SQL的SUBSTR()函数使用介绍
- ini_set的用法介绍
- PHP字符串中特殊符号的过滤方法介绍
- php调用c接口无错版介绍
- MYSQL的REPLACE和ONDUPLICATEKEYUPDATE语句介绍解决问题实例
- Java中static关键字的作用和用法详细介绍