javascript IE中的DOM ready应用技巧


Posted in Javascript onJuly 23, 2008

 如果只需要对DOM进行操作,那么这时就没必要等到页面全部加载了。我们需要更快的方法。
      Firefox有DOMContentLoaded事件可以轻松解决,可惜的就是IE没有。 
      MSDN关于JSCRIPT的一个方法有段不起眼的话,当页面DOM未加载完成时,调用doScroll方法时,会产生异常。那么我们反过来用,如果不异常,那么就是页面DOM加载完毕了!

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();         
        }         
    };         
}

这个函数是Diego Perini在07年就发布了这个方法,
而且获得了广泛认同,以至于现在许多开源框架都是借鉴这种方法,譬如JQuery中的ready。

如果以后需要用到IE的DomReady,就是他了。

用法:
IEContentLoaded(  document.getElementById("test") , test  );

function test(){  }

Javascript 相关文章推荐
javascript基础知识大集锦(一) 推荐收藏
Jan 13 Javascript
jquery 实现窗口的最大化不论什么情况
Sep 03 Javascript
JavaScript 垃圾回收机制分析
Oct 10 Javascript
JS中的构造函数详细解析
Mar 10 Javascript
屏蔽相应键盘按钮操作
Mar 10 Javascript
window.open()实现post传递参数
Mar 12 Javascript
PHP+MySQL+jQuery随意拖动层并即时保存拖动位置实例讲解
Oct 09 Javascript
jQuery实现有动画淡出效果的二级折叠菜单代码
Oct 17 Javascript
AngularJs 禁止模板缓存的方法
Nov 28 Javascript
koa-router源码学习小结
Sep 07 Javascript
JavaScript 正则应用详解【模式、欲查、反向引用等】
May 13 Javascript
Vue切换组件实现返回后不重置数据,保留历史设置操作
Jul 21 Javascript
css把超出的部分显示为省略号的方法兼容火狐
Jul 23 #Javascript
用JavaScript实现UrlEncode和UrlDecode的脚本代码
Jul 23 #Javascript
用js遍历 table的脚本
Jul 23 #Javascript
JavaScript 版本自动生成文章摘要
Jul 23 #Javascript
javascript 支持ie和firefox杰奇翻页函数
Jul 22 #Javascript
IE8 引入跨站数据获取功能说明
Jul 22 #Javascript
兼容多浏览器的字幕特效Marquee的通用js类
Jul 20 #Javascript
You might like
php中使用Imagick实现图像直方图的实现代码
2011/08/30 PHP
php数组一对一替换实现代码
2012/08/31 PHP
Thinkphp模板标签if和eq的区别和比较实例分析
2015/07/01 PHP
微信红包随机生成算法php版
2016/07/21 PHP
Ajax+PHP实现的分类列表框功能示例
2019/02/11 PHP
Gambit vs CL BO3 第三场 2.13
2021/03/10 DOTA
javascript 获取元素位置的快速方法 getBoundingClientRect()
2009/11/26 Javascript
FusionCharts图表显示双Y轴双(多)曲线
2012/11/22 Javascript
JS中的prototype与面向对象的实例讲解
2013/05/22 Javascript
javascript的tab切换原理与效果实现方法
2015/01/10 Javascript
EasyUI闪屏EasyUI页面加载提示(原理+代码+效果图)
2016/02/21 Javascript
Node.js模块封装及使用方法
2016/03/06 Javascript
jQuery实现三级菜单的代码
2016/05/09 Javascript
jQuery选择器基础入门教程
2016/05/10 Javascript
JS在onclientclick里如何控制onclick的执行
2016/05/30 Javascript
JavaScript核心语法总结(推荐)
2016/06/02 Javascript
jQuery Validate验证表单时多个name相同的元素只验证第一个的解决方法
2016/12/24 Javascript
Vue中建立全局引用或者全局命令的方法
2017/08/21 Javascript
JavaScript多态与封装实例分析
2018/07/27 Javascript
vue2.0结合Element-ui实战案例
2019/03/06 Javascript
express + jwt + postMan验证实现持久化登录
2019/06/05 Javascript
Vue记住滚动条和实现下拉加载的完美方法
2020/07/31 Javascript
在Linux系统上安装Python的Scrapy框架的教程
2015/06/11 Python
玩转python爬虫之爬取糗事百科段子
2016/02/17 Python
解决Python运行文件出现out of memory框的问题
2018/12/03 Python
python rsa实现数据加密和解密、签名加密和验签功能
2019/09/18 Python
HTML5 device access 设备访问详解
2018/05/24 HTML / CSS
HTML5新增属性data-*和js/jquery之间的交互及注意事项
2017/08/08 HTML / CSS
教师的实习鉴定
2013/12/15 职场文书
给儿子的表扬信
2014/01/15 职场文书
学习十八大坚定理想信念心得体会
2014/03/11 职场文书
市场拓展计划书
2014/05/03 职场文书
信用卡工作证明范本
2015/06/19 职场文书
C#连接ORACLE出现乱码问题的解决方法
2021/10/05 Oracle
 Python 中 logging 模块使用详情
2022/03/03 Python
《游戏王:大师决斗》新活动上线 若无符合卡组可免费租用
2022/04/13 其他游戏