我在上一篇文章中使用原始javascript的方式构造ajax调用,但从全局看,不仅仅代码的阅读性比较低而且隐藏发生错误的可能,比如在页面加载时就改变dom结构,还要时刻关注浏览器的兼容性,而使用jQuery我们将不存在类似的问题,代码的可读性也显著提高,代码量小,下面是jQuery版本的js部分代码,希望能够对读者有所体会,我后面将陆续转载介绍jQuery的相关知识,欢迎阅读:
<script src="jQuery/jquery-1.3.2-vsdoc2.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
$("#ajaxRequest").bind("click",function(event){
$.get("Demo.aspx",function(data,textStatus){
//清空本页表格中除第一行外的所有行
$("#tabScreen tr:not(:first)").remove();
//iframeTable为框架页面表格Id
var par = $(window.frames["iframeId"].document).find("#iframeTable");
//去掉iframe框架表中除第一行外的所有行
par.find("tr:not(:first)").remove();
//循环item节点
$(data).find("item").each(function(i,obj){
//创建行对象
var tr1 = $("<tr/>");
$("<td/>").text($(obj).find("c1").text()).appendTo(tr1);
$("<td/>").text($(obj).find("c2").text()).appendTo(tr1);
$("<td/>").text($(obj).find("c3").text()).appendTo(tr1);
$("<td/>").text($(obj).find("c4").text()).appendTo(tr1);
//添加进表格
tr1.appendTo($("#tabScreen"));
var c = "<tr/>"+tr1.html();
par.append();
});
});
});
});
</script>