$（document）.ready等同于没有jQuery

我有一个使用$(document).ready的脚本，但是它不使用jQuery的其他任何东西。我想通过删除jQuery依赖项来减轻它的负担。

如何在不使用jQuery的情况下实现自己的$(document).ready功能？我知道使用window.onload会有所不同，因为在加载所有图像，框架等之后， window.onload会触发。

#1楼

穷人的解决方案：

var checkLoad = function() {   
    document.readyState !== "complete" ? setTimeout(checkLoad, 11) : alert("loaded!");   
};  

checkLoad();

查看小提琴

添加了这一点，我想更好一点，自己的范围，并且非递归

(function(){
    var tId = setInterval(function() {
        if (document.readyState == "complete") onComplete()
    }, 11);
    function onComplete(){
        clearInterval(tId);    
        alert("loaded!");    
    };
})()

查看小提琴

#2楼

这个解决方案怎么样？

// other onload attached earlier
window.onload=function() {
   alert('test');
};

tmpPreviousFunction=window.onload ? window.onload : null;

// our onload function
window.onload=function() {
   alert('another message');

   // execute previous one
   if (tmpPreviousFunction) tmpPreviousFunction();
};

#3楼

jQuery答案对我来说非常有用。只需一点重构，就可以很好地满足我的需求。我希望它对其他人有帮助。

function onReady ( callback ){
    var addListener = document.addEventListener || document.attachEvent,
        removeListener =  document.removeEventListener || document.detachEvent
        eventName = document.addEventListener ? "DOMContentLoaded" : "onreadystatechange"

    addListener.call(document, eventName, function(){
        removeListener( eventName, arguments.callee, false )
        callback()
    }, false )
}

#4楼

只需将其添加到HTML页面的底部...

<script>
    Your_Function();
</script>

因为，HTML文档是由上至下解析的。

#5楼

将<script>/*JavaScript code*/</script> 放在结束 </body>标记之前。

诚然，这可能不适合每个人的目的，因为它需要更改HTML文件，而不是仅仅做一些JavaScript文件在la document.ready ，但仍...

来源：oschina

链接：https://my.oschina.net/stackoom/blog/3137563

标签

jquery文档

var

jquery