Javascript 如何在不使用 jQuery（替代方式）的情况下知道页面何时准备就绪？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/8575940/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to know when page is ready without using jQuery (alternative way)?
提问by Ito
Possible Duplicate:
$(document).ready equivalent without jQuery
If you have jQuery called in your page. You can simply do it:
如果您在页面中调用了 jQuery。你可以简单地做到这一点：
$(document).ready(function() { /** code inside **/});
But how to do similar thing without jQuery?
但是如何在没有 jQuery 的情况下做类似的事情？
回答by alex
You can use the DOMContentLoadedevent.
您可以使用该DOMContentLoaded事件。
document.addEventListener('DOMContentLoaded', function() {
// ...
});
Note that in older IEs you need workarounds, some use the readystatechangeevent if I recall correctly.
请注意，在较旧的 IE 中，您需要解决方法，readystatechange如果我没记错的话，有些会使用该事件。
回答by Shalom Craimer
I think the simplest way to answer your question is to answer "How does jQuery do it?" and for that, I'd recommend looking as the source code. The most relevant part of the code is at https://github.com/jquery/jquery/blob/master/src/core.js#L423
我认为回答您的问题的最简单方法是回答“jQuery 是如何做到的？” 为此，我建议您查看源代码。代码中最相关的部分位于 https://github.com/jquery/jquery/blob/master/src/core.js#L423
Here's a snippet:
这是一个片段：
// Catch cases where $(document).ready() is called after the
// browser event has already occurred.
if ( document.readyState === "complete" ) {
// Handle it asynchronously to allow scripts the opportunity to delay ready
return setTimeout( jQuery.ready, 1 );
}
// Mozilla, Opera and webkit nightlies currently support this event
if ( document.addEventListener ) {
// Use the handy event callback
document.addEventListener( "DOMContentLoaded", DOMContentLoaded, false );
// A fallback to window.onload, that will always work
window.addEventListener( "load", jQuery.ready, false );
// If IE event model is used
} else if ( document.attachEvent ) {
// ensure firing before onload,
// maybe late but safe also for iframes
document.attachEvent( "onreadystatechange", DOMContentLoaded );
// A fallback to window.onload, that will always work
window.attachEvent( "onload", jQuery.ready );
// If IE and not a frame
// continually check to see if the document is ready
var toplevel = false;
try {
toplevel = window.frameElement == null;
} catch(e) {}
if ( document.documentElement.doScroll && toplevel ) {
doScrollCheck();
}
}
回答by dku.rajkumar
window.onload = function(){
// do something
}
回答by Umesh Patil
Use below script:
使用以下脚本：
<script type="text/JavaScript">
function funtionToBeCalled(){
// code that will be exected after dom ready
}
window.onload=funtionToBeCalled;
</script>
Or there is one more way. Add onload event in body tag as below:
或者还有一种方法。在 body 标签中添加 onload 事件如下：
<body onload='functionToBeCalled();'>
</body>
