设为主页
加入收藏
帮助
|
留言交流
|
首 页
阅览室
馆友
我的图书馆
window.onload 关于页面加载完毕的问题
duduwolf
收藏于
2005-09-29
阅读数:
公众公开
转藏到我的图书馆
英文原文在此:
http://dean.edwards.name/weblog/2005/09/busted/
大义如下:
我们经常使用 window.onload 来处理页面,当页面加载完成做一些事情。但这个 window.onload 是
页面全部加载完成
,甚至包括图片,而我们实际上经常需要的是
文档 DOM 加载完毕
!
这是原来的方法。
<script type="text/javascript"> function init(){ alert("页面加载完毕!"); } window.onload=init; </script>
[Ctrl+A 全部选择 提示:你可先修改部分代码,再按运行]
对于 Mozilla 可以这样
<script type="text/javascript"> // for Mozilla browsers if (document.addEventListener) { document.addEventListener("DOMContentLoaded", function(){alert("DOM加载完毕!")}, null); } </script>
[Ctrl+A 全部选择 提示:你可先修改部分代码,再按运行]
对于 IE 浏览器,可以使用IE特有的 defer 属性。
<script defer type="text/javascript"> alert("DOM 加载完毕!") </script>
[Ctrl+A 全部选择 提示:你可先修改部分代码,再按运行]
非IE浏览器会忽略 defer 而直接执行 script 代码,你可以有两种办法来屏蔽 非IE浏览器。
conditional comments
条件注释
<!--[if IE]> <script defer type="text/javascript"> alert("DOM 加载完毕!") </script> <![endif]-->
[Ctrl+A 全部选择 提示:你可先修改部分代码,再按运行]
conditional compilation
条件编辑
<script defer> // for Internet Explorer /*@cc_on @*/ /*@if (@_win32) alert("DOM 加载完毕!") /*@end @*/ </script>
[Ctrl+A 全部选择 提示:你可先修改部分代码,再按运行]
除此之外的浏览器就使用最上面第一个好了。最后一个问题就是要避免 onload 运行多次的问题,加入判断。
<script type="text/javascript"> function init() { // quit if this function has already been called if (arguments.callee.done) return; // flag this function so we don‘t do the same thing twice arguments.callee.done = true; // create the "page loaded" message var text = document.createTextNode("Page loaded!"); var message = document.getElementById("message"); message.appendChild(text); }; /* for Mozilla */ if (document.addEventListener) { document.addEventListener("DOMContentLoaded", init, null); } /* for Internet Explorer */ /*@cc_on @*/ /*@if (@_win32) document.write("<script defer src=ie_onload.js><"+"/script>"); /*@end @*/ /* for other browsers */ window.onload = init; </script> <p id="message"></p>
真是很佩服老外的这种钻研精神,这么个小问题引申出来这么多知识,值得我们好好学习。:(
此文来自
duduwolf
的文件夹
[
编程
]
关闭
相关文章
大家都喜欢
YY in Limbo 混沌海狂想 ? DOM加载事件的...
The window.onload Problem
Javascript在网页页面加载时的执行顺序
怎样在Web开发中完美控制IE标题栏 - 鸟食...
javascript---浅析注册事件. - 前端技术...
window.onload的页面加载技巧 方法 括号...
查看更多>>
javascript弹出窗口问题总结_Javascript...
如何提高页面响应速度
运行时设置javascript
弹出窗口代码
图片自动缩小的js代码,用以防止图片撑破...
初学者制作网页需要学习的技术
好文推荐
叶木盆景——我喜欢的盆景艺术系...
全球35种最灵性的动物
中国孩子想像力世界倒数第一?
如何考好路考?考驾照路考内容解...
[中华文化]扬州八怪字画欣赏
美!-色影无忌 25
中医提醒:这9类人千万不能吃辣...
教科书以外的真相:旧中国不是一...
天下美食任你品尝<鸡肉类>
世界名胜之旅:美洲篇
五分钟搞定的解馋菜-【快手版焦...
2012年最值得旅游的十大城市
掬水月在手,弄花香满衣…【唯美...
家庭炒滑嫩肉丝的妙招
85后喜欢的手绘墙,比你以往看的...
优雅是一种深邃的美
行间(荥火穴):善治目赤肿痛、...
流光容易把人抛,红了樱桃,绿了...
中国出土玉器全集第八集
六味中药为你留住青春脚步
好音乐
女子十二乐坊 《世界上唯一的...
【口哨音乐】中外名曲71首精选
【钢琴启蒙-多来咪】FLASH课程:...
中国礼仪曲集大全
《草原天弦》-全球首张中胡发烧...
视频: 俞逊发笛子教程技巧与训练...
中国的人间仙境-美妙二胡曲选
好影视
《尸研所 第一季》1~6集全
【电影】鸾凤和鸣 (泰国 喜剧片...
黑泽明经典武侠动作片:战国英豪...
影视
泰國電影《真爱》真好看!
异常睡眠(梦中杀人)【美国恐怖片...
大陆电影3890部之(1561~1680部...