个人经验:页面无刷新传输数据的多种方法总结
接触这么长时间,发现一些这样,那样的特性. 现在总结一下:
方法一:ajax
比较潮流的就是ajax了.
具体方法就不说了,网上很流行... (我个人很少用,不能跨域比较麻烦)
缺点:有部分编码问题,不能跨域;有时候刷新还比较慢,用的时候一定要小心,适合自己才行。
方法二:用一个script对象的src来load不同路径的js
这个方法其实应该是最古老的方法了...出现在ajax之前...十分简单,直接,原始.
个人最喜欢的方法.不像xmlhttp对象那么麻烦...
例如在页面里声明:
<script id="dyscript"></script>
然后声明一个js函数
<script language="javascript">
function LoadScript(objId,destSrc){
var objScript = document.getElementById(objId);
if(objScript){
objScript.src = destSrc;
}
}
</script>
在需要的时候调用这个LoadScript就ok了. 例如 <a href="javascript:LoadScript('dyscript','http://abc.com/abc.cgi?page=3&id=7')">
然后再在abc.cgi这个cgi(或者php或者jsp也ok,没有平台限制)里输出相关的js数组结果什么的.
最后回调一下就ok了.
这个方法十分好用.不知道为什么很多ajax书的教程里都很少提及.想到这个也是给逼出来的...做一个项目的时候到最后才发现ajax的跨子域问题...
不得已想到去动script对象的src属性的念头...最后的效果很好. 嘿嘿. 后来在网上搜了一下.原来这个方法很古老了. 不过最近流行ajax....所以快被遗忘了.
优点:完全没有跨域的问题,调用方便.使用这种方法可以很方便地书写一些js+动态数据的插件,如简单的投票功能,评价功能等等.
缺点:因为这样的调用是http的get方法,所以会有参数最长为1024的限制. 不能支持很大的参数传输. 不过基本上1024字节已经够很多简短评语和数据显示ID参数的应用了
方法三: iframe法
这个也比较简单古老.具体应用就是用一个hidden iframe来做传输中介了. 具体代码就不写了.
有一点要注意的是iframe的东东默认是不能跨子域的.可以通过声明 document.domain = "abc.com"; 来让页面知道同子域.
这个安全声明也可以用在其他有安全限制的地方. 因为浏览器的默认级别是要域完全相同才能共用数据对象的...这个声明比较有用.
方法四: xsl+xml 法
这个可以用xmlhttp对象来加载解析成简单的xml对象来显示到页面上. 也是插件式的不过不能跨域. 这种方法能很好地分离美工和数据源.比较适合页面片的显示.如排行榜,新闻列表等.
示例如下
<script language="JavaScript" src="jax_comm.js"></script>
var sGroupXmlUrl = "/GroupOrder.xml";
var sOrderXslUrl = "/order.xsl";
var objWarterWeek = document.getElementById("orderWarterWeek");
var objLoadGroup = new CLoadXX(objGroup,sGroupXmlUrl,sGroupXslUrl);
objLoadGroup.LoadNow();
使用这种方法要注意输出的xml数据里不能有破坏xml语法的字符.
其他如flash load 数据. javaapplet load 数据等等就不详述了...
以上方法均支持多浏览器...