js 自己创建ready多个可以依次加载

最新推荐文章于 2020-12-03 08:22:30 发布

辛苦的码农20200609

最新推荐文章于 2020-12-03 08:22:30 发布

阅读量182

点赞数

分类专栏：前端

原文链接：https://www.mk2048.com/blog/blog_hj0khk2hjkaa.html

版权

前端专栏收录该内容

785 篇文章 4 订阅

订阅专栏

js会把相同的方法名给覆盖了，很多时候我们都无法再页面加载的时候写多个onload事件，这样只有最后一个才能起效，所以从网上找了找，最后决定自己写一个，例子很简单，希望有高人来指导指导

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>javascript_window.ready</title>
</head>
<body>
<script type="text/javascript">

(function(w){
    w.readyLength=0;
    w.readyFunction=[];
    w.ready=function(load){
        w.readyFunction[w.readyLength]=load;
        w.readyLength++;
    }
    w.init=function(){
        clearInterval(w.readyById);
        w.readyFunction.reverse();
        while(w.readyFunction.length-1>=0){
            w.readyFunction[w.readyFunction.length-1]();
            w.readyFunction.pop();
            w.readyLength--;
        }
    }
    if('onreadystatechange' in w.document){
        w.document.onreadystatechange=onreadystatechange;
    }else{
        w.readyById = setInterval(onreadystatechange,10);
    } 
    function onreadystatechange(){
        console.log(w.document.readyState)
        if(w.document.readyState == "complete"){
            setTimeout(init,1);
        }else if(w.document.addEventListener){
            w.document.addEventListener( "DOMContentLoaded", init, false );
            w.addEventListener('load',init,false)
        }else{
            document.attachEvent( "onreadystatechange", init );
            w.attachEvent('onload',init)
        }
    }
}(this));
(function(){
window.ready(function(){
    console.log('ready1')
});
window.ready(function(){
    console.log('ready2')
})

window.ready(function(){
    console.log('ready3')
})
}());;;


</script>


</body>
</html>

辛苦的码农20200609

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
js 自己创建ready多个可以依次加载

js会把相同的方法名给覆盖了，很多时候我们都无法再页面加载的时候写多个onload事件，这样只有最后一个才能起效，所以从网上找了找，最后决定自己写一个，例子很简单，希望有高人来指导指导<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>javascript_window.ready</title></head><body>
复制链接

扫一扫