DOMContentLoaded事件

今天查看百度空间源代码,发现多了个util.js文件,打开看看。里面里面定义了addDOMLoadEvent。这是干什么用的?网络

仔细查看代码,发如今Mozilla添加了DOMContentLoaded事件,这个在之前一直没有用过。                    if (document.addEventListener)
                        document.addEventListener("DOMContentLoaded", init, false);dom

好像就是为了兼容实现DOMContentLoaded事件。工具

网上找了点有关DOMContentLoaded的资料拿来看看。优化

DOMContentLoaded是firefox下特有的Event, 当全部DOM解析完之后会触发这个事件。
    与DOM中的onLoad事件与其相近。但onload要等到全部页面元素加载完成才会触发, 包括页面上的图片等等。
    若是页面的图片不少的话, 从用户访问到onload触发可能须要较长的时间, 而在Ajax运用中, 经常须要在onload中加入许多初始化的动做, 若是因为网络问题引发的图片加载过慢( 见: Ajax优化(2) -- lazierLoad img && js), 则必然影响用户的体验。
    在这种状况下firefox的DOMContentLoaded事件, 偏偏是咱们须要的。

    目前,跨平台的DOMContentLoaded的解决方案有不少, 好比jQuery, Prototype...等等, 其实现原理大同小异.

    在项目中, 我使用了Prototype工具, 以往调用初始化的方法是:firefox

Event.observe(window, "load", init);


    如今有了DOMContentLoaded, 能够替换成以下的方法:prototype

document.observe('contentloaded', init);



    最新的prototype中自定义事件已经从新命名, 使用"dom:loaded" 代替了 “contentloaded”.事件

document.observe('dom:loaded', init);
相关文章
相关标签/搜索