jquery页面加载成功后自动执行

来源:互联网 发布:python json 打印出来 编辑:程序博客网 时间:2024/05/01 18:07
jquery加载页面的方法(页面加载完成就执行),建议大家看下windows.onload与$(document).ready之间的区别。
<iframe id="cproIframe_u2298924_2" width="650" height="200" src="http://pos.baidu.com/acom?adn=3&amp;adp=1&amp;at=0&amp;aurl=&amp;c01=1&amp;cad=1&amp;ccd=24&amp;cec=GBK&amp;cfv=0&amp;ch=0&amp;col=zh-CN&amp;conBW=0&amp;conOP=1&amp;cpa=1&amp;cpro_lu=1%2C%23dfe4f9%2C%23000000%2C%E5%AE%8B%E4%BD%93&amp;dai=2&amp;dis=0&amp;layout_filter=image&amp;ltr=https%3A%2F%2Fwww.baidu.com%2Flink%3Furl%3DStNgdYVzhQEwmJSVQgbPyubh5LarjDPPP3tGMeZN5BVyXj8K-QBthie06hUJSlEl%26wd%3D%26eqid%3Ddbfe02f4000810da0000000556186a4c&amp;ltu=http%3A%2F%2Fwww.jb51.net%2Farticle%2F27444.htm&amp;lu_161=0&amp;lunum=6&amp;n=jb51_cpr&amp;pat=1&amp;pcs=1903x995&amp;pih=80&amp;pis=10000x10000&amp;piw=130&amp;ps=516x486&amp;psr=1920x1080&amp;pss=1903x517&amp;ptbg=90&amp;ptp=0&amp;ptt=0&amp;qn=35ffa83a758b4881&amp;rad=&amp;rsi0=650&amp;rsi1=200&amp;rsi5=4&amp;rss0=%23FFFFFF&amp;rss1=%23FFFFFF&amp;rss2=%23000000&amp;rss3=%23444444&amp;rss4=%23008000&amp;rss5=&amp;rss6=%23e10900&amp;rss7=&amp;scale=&amp;skin=tabcloud_skin_5&amp;stid=5&amp;td_id=2298924&amp;tft=0&amp;titFF=%25E5%25BE%25AE%25E8%25BD%25AF%25E9%259B%2585%25E9%25BB%2591&amp;titFS=14&amp;titSU=0&amp;titTA=left&amp;tlt=0&amp;tn=baiduCustNativeAD&amp;tpr=1444440659777&amp;ts=1&amp;version=2.0&amp;xuanting=0&amp;dtm=BAIDU_DUP2_SETJSONADSLOT&amp;dc=2&amp;di=u2298924&amp;ti=jquery%E5%8A%A0%E8%BD%BD%E9%A1%B5%E9%9D%A2%E7%9A%84%E6%96%B9%E6%B3%95(%E9%A1%B5%E9%9D%A2%E5%8A%A0%E8%BD%BD%E5%AE%8C%E6%88%90%E5%B0%B1%E6%89%A7%E8%A1%8C)_jquery_%E8%84%9A%E6%9C%AC%E4%B9%8B%E5%AE%B6&amp;rs=60010&amp;tt=1444440659758.118.276.277" align="center,center" marginwidth="0" marginheight="0" scrolling="no" frameborder="0" allowtransparency="true"></iframe>
1、$(function(){ 
  $("#a").click(function(){ 
    //adding your code here 
  }); 
}); 
2、$(document).ready(function(){ 
  $("#a").click(function(){ 
    //adding your code here   
  }); 
}); 
3、window.onload = function(){ 
  $("#a").click(function(){ 
    //adding your code here 
  }); 

html代码为<input type="button" id="a">点击</input>,且页面需要引用jquery的js文件 

一般的加载页面时调用js方法如下: 

window.onload = function() { 
$("table tr:nth-child(even)").addClass("even"); //这个是jquery代码 
}; 

这段代码会在整个页面的document全部加载完成以后执行。不幸的这种方式不仅要求页面的DOM tree全部加载完成,而且要求所有的外部图片和资源全部加载完成。更不幸的是,如果外部资源,例如图片需要很长时间来加载,那么这个js效果就会让用户感觉失效了。 

但是用jquery的方法: 

$(document).ready(function() { 

// 任何需要执行的js特效 
$("table tr:nth-child(even)").addClass("even"); 
}); 

就仅仅只需要加载所有的DOM结构,在浏览器把所有的HTML放入DOM tree之前就执行js效果。包括在加载外部图片和资源之前。 

还有一种简写的方式: 

$(function() { 

// 任何需要执行的js特效 
$("table tr:nth-child(even)").addClass("even"); 
});
0 0
原创粉丝点击