首页 JavaScript源码正文

JS原生封装addReady函数

JS原生封装addReady函数:

使用规则类似于jquery中的$(function(){ });

ready VS window.onload

  window.onload  HTML CSS JS 图片、音频、视频...
   ready                 HTML CSS JS


    DOMContentLoaded 高版本浏览器
    onreadystatechange
    document.readyState == 'complete'
   一共有两个状态值:
    interactive
    complete

function addReady(fn)
{
    if (document.addEventListener)
    {
        document.addEventListener('DOMContentLoaded', fn, false);
    }
    else
    {
        document.attachEvent('onreadystatechange', function (){
            if (document.readyState == 'complete')
            {
                fn();
            }
        });
    }
}

使用方式:

addReady(function (){
    var oBtn=document.getElementById('btn');
    var oDiv=document.getElementById('div1');
    
    oBtn.onclick=function (){
        oDiv.style.display='none';
    };
});


版权声明

本文仅代表作者观点,不代表本站立场。
本文系作者授权发表,未经许可,不得转载。

评论