首页 > 编程语言 > 详细

jQuery $(document).ready()和JavaScript onload事件详解区别

时间:2015-10-12 17:31:39      阅读:165      评论:0      收藏:0      [点我收藏+]

jQuery $(document).ready()和window.onload

  根据ready()方法的API说明http://api.jquery.com/ready/

  这个方法接收一个function类型的参数ready(handler), 方法的作用是: Specify a function to execute when the DOM is fully loaded.

  即当DOM加载完毕的时候,执行这个指定的方法.

  因为只有document的状态ready之后,对page的操作才是安全的.

  $(document).ready()仅在DOM准备好的时候执行一次.

 

  与之相比,load事件会等到页面渲染完成执行,即等到所有的资源(比如图片)都完全加载完成的时候.

  $(window).load(function(){…})会等整个页面,不仅仅是DOM,还包括图像和iframes都准备好之后,再执行.

  而ready()是在DOM准备好之后就执行了,即DOM树建立完成的时候.所以通常ready()是一个更好的时机.

 

  如果DOM初始化完成之后再调用ready()方法,传入的新的handler将会立即执行.

 

  注意:ready()方法多次调用,传入的handler方法会串联执行(追加).

  而JavaScript中,window.onload是赋值一个方法,即后面的会覆盖掉前面的.


一系列测试结论 ,详细看链接

结论:触发先后次序

在Chrome中:

  ready()

  window.onload==document.body.onload

  <body onload=“">

 

在FireFox中:

  ready()

  window.onload==<body onload=“”>==document.body.onload

 

  此分析的结果跟浏览器,甚至浏览器版本相关,本文写于2015.2.6

  Chrome Version: 40.0.2214.94

  FireFox Version: 35.0

转发:http://www.cnblogs.com/mengdd/p/4276801.html

jQuery $(document).ready()和JavaScript onload事件详解区别

原文:http://my.oschina.net/u/1579617/blog/515910

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!