浏览器解析大致有以下几个步骤:
(1) 解析 html 结构
(2) 加载外部脚本和样式
(3) 解析并执行脚本代码
(4) 构造 HTML DOM 模型
(5) 加载图片等外部文件
(6) 界面加载完成
window.onload 会在页面所有内容加载完成之后执行 (第 6 步之后), 比如图片等对媒体文件. 如果媒体文件较多, 即时网页文档已经显示, 但 load 事件不会触发.
document.ready 会在 DOM 绘制完毕后执行 (第 4 步之后), 能确保文档呈现和脚本初始化同时完成.
window.onload 只能写一次, 而 document.ready 可以写多次.
- <script type="text/javascript">
- // 只会显示 load2
- window.onload=function () {
- alert("load1")
- }
- window.onload=function () {
- alert("load2")
- }
- </script>
- <script type="text/javascript">
- // 都会执行
- $(document).ready(function () {
- alert("ready1")
- })
- $(document).ready(function () {
- alert("ready2")
- })
- // 简化形式
- $(function () {
- alert("ready3")
- })
- </script>
来源: http://www.bubuko.com/infodetail-2689171.html