window.onload和document.ready

浏览器解析大致有以下几个步骤:

(1)     解析HTML结构

(2)       加载外部脚本和样式

(3)       解析并执行脚本代码

(4)       构造HTML DOM 模型

(5)       加载图片等外部文件

(6)       界面加载完成

window.onload会在页面所有内容加载完成之后执行(第6步之后),比如图片等对媒体文件。如果媒体文件较多,即时网页文档已经显示,但load事件不会触发。

document.ready会在DOM绘制完毕后执行(第4步之后),能确保文档呈现和脚本初始化同时完成。

window.onload只能写一次,而document.ready可以写多次。

1 <script type="text/javascript">
2     //只会显示load2
3    window.onload=function () {
4        alert("load1")
5    }
6    window.onload=function () {
7        alert("load2")
8    }
9 </script>
 1 <script type="text/javascript">
 2     //都会执行
 3     $(document).ready(function () {
 4         alert("ready1")
 5     })
 6     $(document).ready(function () {
 7         alert("ready2")
 8     })
 9     //简化形式
10     $(function () {
11         alert("ready3")
12     })
13 </script>

 

posted @ 2018-07-17 19:56  少说点话  阅读(223)  评论(0编辑  收藏  举报
网站运行: