window.onload 加载完毕的问题及解决方案(下)


Posted in Javascript onJuly 09, 2009

接上篇,其它方法:
一、在IE中还可以在onreadystatechange事件里进行判断
http://www.thefutureoftheweb.com/blog/adddomloadevent
这里有Jesse Skinner写了一段独立的脚本函数来解决各种浏览器的onload问题,。
http://img.3water.com/jslib/adddomloadevent.js

/* 
* (c)2006 Jesse Skinner/Dean Edwards/Matthias Miller/John Resig 
* Special thanks to Dan Webb's domready.js Prototype extension 
* and Simon Willison's addLoadEvent 
* 
* For more info, see: 
* http://www.thefutureoftheweb.com/blog/adddomloadevent 
* http://dean.edwards.name/weblog/2006/06/again/ 
* http://www.vivabit.com/bollocks/2006/06/21/a-dom-ready-extension-for-prototype 
* http://simon.incutio.com/archive/2004/05/26/addLoadEvent 
* 
* 
* To use: call addDOMLoadEvent one or more times with functions, ie: 
* 
* function something() { 
* // do something 
* } 
* addDOMLoadEvent(something); 
* 
* addDOMLoadEvent(function() { 
* // do other stuff 
* }); 
* 
*/ addDOMLoadEvent = (function(){ 
// create event function stack 
var load_events = [], 
load_timer, 
script, 
done, 
exec, 
old_onload, 
init = function () { 
done = true; 
// kill the timer 
clearInterval(load_timer); 
// execute each function in the stack in the order they were added 
while (exec = load_events.shift()) 
exec(); 
if (script) script.onreadystatechange = ''; 
}; 
return function (func) { 
// if the init function was already ran, just run this function now and stop 
if (done) return func(); 
if (!load_events[0]) { 
// for Mozilla/Opera9 
if (document.addEventListener) 
document.addEventListener("DOMContentLoaded", init, false); 
// for Internet Explorer 
/*@cc_on @*/ 
/*@if (@_win32) 
document.write("<script id=__ie_onload defer src="//0" src="http://0"><\/scr"+"ipt>"); 
script = document.getElementById("__ie_onload"); 
script.onreadystatechange = function() { 
if (this.readyState == "complete") 
init(); // call the onload handler 
}; 
/*@end @*/ 
// for Safari 
if (/WebKit/i.test(navigator.userAgent)) { // sniff 
load_timer = setInterval(function() { 
if (/loaded|complete/.test(document.readyState)) 
init(); // call the onload handler 
}, 10); 
} 
// for other browsers set the window.onload, but also execute the old window.onload 
old_onload = window.onload; 
window.onload = function() { 
init(); 
if (old_onload) old_onload(); 
}; 
} 
load_events.push(func); 
} 
})();

二、另外还有在IE中的doScroll的,这是种方法只对IE有作用,而且它是一种hack方法。

在MSDN:About Element Behaviors 我们可以看到

When the ondocumentready event fires, the document has been completely parsed and built. Initialization code should be placed here if the component needs to navigate the primary document structure. The ondocumentready event notifies the component that the entire page is loaded, and it fires immediately before the onload event fires in the primary document. 
A few methods, such as doScroll, require the primary document to be completely loaded. If these methods are part of an initialization function, they should be handled when the ondocumentready event fires.

http://javascript.nwbox.com/IEContentLoaded/
/* 
* 
* IEContentLoaded.js 
* 
* Author: Diego Perini (diego.perini at gmail.com) NWBOX S.r.l. 
* Summary: DOMContentLoaded emulation for IE browsers 
* Updated: 05/10/2007 
* License: GPL/CC 
* Version: TBD 
* 
*/ // @w    window reference 
// @fn    function reference 
function IEContentLoaded (w, fn) { 
    var d = w.document, done = false, 
    // only fire once 
    init = function () { 
        if (!done) { 
            done = true; 
            fn(); 
        } 
    }; 
    // polling for no errors 
    (function () { 
        try { 
            // throws errors until after ondocumentready 
            d.documentElement.doScroll('left'); 
        } catch (e) { 
            setTimeout(arguments.callee, 50); 
            return; 
        } 
        // no errors, fire 
        init(); 
    })(); 
    // trying to always fire before onload 
    d.onreadystatechange = function() { 
        if (d.readyState == 'complete') { 
            d.onreadystatechange = null; 
            init(); 
        } 
    }; 
}

在jQuery的源码中,针对Mozilla, Opera 和webkit用的是DOMContentLoaded,也就是上一篇中第一种;

而对IE用的是doScroll的方法。

Javascript 相关文章推荐
Extjs学习笔记之八 继承和事件基础
Jan 08 Javascript
jQuery EasyUI API 中文文档 - ProgressBar 进度条
Sep 29 Javascript
了解一点js的Eval函数
Jul 26 Javascript
CSS3,HTML5和jQuery搜索框集锦
Dec 02 Javascript
简述AngularJS的控制器的使用
Jun 16 Javascript
jQuery实现类似老虎机滚动抽奖效果
Aug 06 Javascript
javascript html5实现表单验证
Mar 01 Javascript
原生JS获取元素集合的子元素宽度实例
Dec 14 Javascript
Node.js中如何合并两个复杂对象详解
Dec 31 Javascript
Vue.use源码分析
Apr 22 Javascript
vue注册组件的几种方式总结
Mar 08 Javascript
vue 路由守卫(导航守卫)及其具体使用
Feb 25 Javascript
window.onload 加载完毕的问题及解决方案(上)
Jul 09 #Javascript
最简单的jQuery程序 入门者学习
Jul 09 #Javascript
Jquery 组合form元素为json格式,asp.net反序列化
Jul 09 #Javascript
JS 巧妙获取剪贴板数据 Excel数据的粘贴
Jul 09 #Javascript
JavaScript 继承的实现
Jul 09 #Javascript
jquery text,radio,checkbox,select操作实现代码
Jul 09 #Javascript
javascript 字符 Escape,encodeURI,encodeURIComponent
Jul 09 #Javascript
You might like
2020年4月放送决定!第2期TV动画《邪神酱飞踢》视觉图&主题曲情报公开!
2020/03/06 日漫
《逃离塔科夫》——“萌新劝退,老手自嗨”的硬核FPS游戏
2020/04/03 其他游戏
PHP按行读取文件时删除换行符的3种方法
2014/05/04 PHP
phpMyAdmin安装并配置允许空密码登录
2015/07/04 PHP
php车辆违章查询数据示例
2016/10/14 PHP
php 判断字符串编码是utf-8 或gb2312实例
2016/11/01 PHP
PHP 7.1新特性的汇总介绍
2016/12/16 PHP
php实现产品加入购物车功能(1)
2020/07/23 PHP
Laravel如何创建服务器提供者实例代码
2019/04/15 PHP
关于实现代码语法标亮 dp.SyntaxHighlighter
2007/02/02 Javascript
js检测客户端不是firefox则提示下载
2007/04/07 Javascript
从零开始学习jQuery (六) jquery中的AJAX使用
2011/02/23 Javascript
javascript学习笔记(九)javascript中的原型(prototype)及原型链的继承方式
2011/04/12 Javascript
随窗体滑动的小插件sticky源码
2013/06/21 Javascript
写得不错的jquery table鼠标经过变色代码
2013/09/27 Javascript
ajax与302响应代码测试
2013/10/23 Javascript
jQuery的选择器中的通配符使用介绍
2014/03/20 Javascript
javascript在网页中实现读取剪贴板粘贴截图功能
2014/06/07 Javascript
JavaScript面对国际化编程时的一些建议
2015/06/24 Javascript
纯javascript实现图片延时加载方法
2015/08/21 Javascript
基于JavaScript代码实现随机漂浮图片广告
2016/01/05 Javascript
jQuery实现的多张图无缝滚动效果【测试可用】
2016/09/12 Javascript
vue router的基本使用和配置教程
2018/11/05 Javascript
原生js实现九宫格拖拽换位
2021/01/26 Javascript
在Python中操作字符串之rstrip()方法的使用
2015/05/19 Python
利用Python如何生成随机密码
2016/04/20 Python
利用Python爬取可用的代理IP
2016/08/18 Python
django定期执行任务(实例讲解)
2017/11/03 Python
Rosetta Stone官方网站:语言学习
2019/01/05 全球购物
采购部部门职责
2013/12/15 职场文书
总结表彰大会主持词
2014/03/26 职场文书
法定代表人资格证明书
2014/09/11 职场文书
2014年惩防体系建设工作总结
2014/12/01 职场文书
倡议书作文
2015/01/19 职场文书
2015年秋学期师德师风建设工作总结
2015/10/23 职场文书
学校学习型党组织建设心得体会
2019/06/21 职场文书