js中替换window.onload的方法 document.ready

阅读更多

 通常我们想要在页面内容加载完成后运行 JS 时,都会使用 window.onload 来处理,比如:

 

     这段代码将在页面载入完成后弹出一个 "Hello World!" 的警告框,但是众所周知,window.onload 的特点是页面元素全部加载完成后才执行,比如页面内有大量的图片之类,当打开网页时,其实相关的 DOM 已经全部加载完成,此时已经可以执行你想要执行的脚本了,可是图片的加载速度要很慢于页面的 HTML,这显然在大多数情况下不是我们想要的。

      jQuery 提供一个 $(document).ready(); 来解决此问题,当页面 DOM 加载完成后,ready() 里的函数便会立即执行,但如果我们在不使用 jQuery 的情况下呢?
好了,废话不多说,大家都明白想要什么,以下是来自国外网站的一段代码,功能同等于 jQuery 的 $(document).ready();

看代码:

      把这段代码放到你的页面中或者某个导入的脚本中,然后你就可以像下面这样使用了:

 


      打开页面,看到效果没?YES,这就是去掉了 $(); 的 document.ready(); 咱不再依赖 jQuery,但如果你的站点已经使用了 jQuery,就不用再多此一举了。

      另外还有一个来自于 PHPWind 论坛程序中某个脚本中的函数片段(由于字数限制,此处省略,详细的可看原文作者:http://www.vgot.net/?A65.htm )

      其实 window.onload 也并非是一无用处,很多情况下一些B/S软件需要页面全部加载后才提供用户相关功能,这样 window.onload 就可以提供一种“加载中”的功能,又或者是页面内容很少,完全无需 document.ready(); 根据各种情况,应该合理的使用 onload 和 ready。

 

 

                                  为保护作者版权,特此连接原文作者连接:http://www.vgot.net/?A65.htm

 

另外:经实践得知,两者都可以加载多个函数

你可能感兴趣的:(javascript)