Answers:
这些解决方案将起作用：
<body onload="script();">要么
document.onload = function ...甚至
window.onload = function ...document.onload=是非侵入性的 en.wikipedia.org/wiki/Unobtrusive_JavaScript
使脚本设置在加载时运行的函数的合理可移植，非框架的方式：
if(window.attachEvent) {
window.attachEvent('onload', yourFunctionName);
} else {
if(window.onload) {
var curronload = window.onload;
var newonload = function(evt) {
curronload(evt);
yourFunctionName(evt);
};
window.onload = newonload;
} else {
window.onload = yourFunctionName;
}
}
当初始HTML文档已完全加载和解析而没有等待样式表，图像和子帧完成加载时，将引发此事件。在此阶段，您可以根据用户设备或带宽速度以编程方式优化图像和CSS的加载。
在加载DOM之后执行（在img和css之前）：
document.addEventListener("DOMContentLoaded", function(){
//....
});
注意：同步JavaScript会暂停DOM的解析。如果您希望在用户请求页面后尽快解析DOM，则可以将JavaScript异步化并优化样式表的加载
完全不同的事件load只能用于检测已满的页面。在DOMContentLoaded更合适的地方使用负载是一个非常普遍的错误，因此请务必谨慎。
加载并解析所有内容后的摘录：
window.addEventListener("load", function(){
// ....
});
MDN资源：
https://developer.mozilla.org/en-US/docs/Web/Events/DOMContentLoaded https://developer.mozilla.org/en-US/docs/Web/Events/load
所有事件的MDN列表：
window.onload = ...以为我的脚本会等到所有内容都完全下载后再运行，但window.onload实际上它的行为类似于document.addEventListener("DOMContentLoaded", ...，而window.addEventListener("load", ...实际上确实等待所有内容都被完全下载。我本以为window.onload应该等于window.addEventListener("load", ...而不是document.addEventListener("DOMContentLoaded", ...?? 我在Chrome和FF中得到了相同的结果。
如果脚本加载在<head>文档的内，则可以使用deferscript标签中的属性。
例：
<script src="demo_defer.js" defer></script>来自https://developer.mozilla.org：
推迟
设置此布尔值属性是为了向浏览器指示脚本应在解析文档之后但在触发DOMContentLoaded之前执行。
如果不存在src属性（即，对于内联脚本），则不得使用此属性，在这种情况下，它将无效。
要对动态插入的脚本实现类似的效果，请改用async = false。具有defer属性的脚本将按照它们在文档中出现的顺序执行。
这是一个基于页面加载后延迟js加载的脚本，
<script type="text/javascript">
function downloadJSAtOnload() {
var element = document.createElement("script");
element.src = "deferredfunctions.js";
document.body.appendChild(element);
}
if (window.addEventListener)
window.addEventListener("load", downloadJSAtOnload, false);
else if (window.attachEvent)
window.attachEvent("onload", downloadJSAtOnload);
else window.onload = downloadJSAtOnload;
</script>
我该放在哪里？
将代码粘贴到HTML中的
</body>标记之前（HTML文件底部附近）。
它有什么作用？
该代码表示等待整个文档加载，然后加载外部文件
deferredfunctions.js。
这是上述代码的示例-JS的延迟渲染
我基于延迟加载javascript pagespeed google概念而编写了此文件，也从本文中获得了延迟加载javascript的信息
看钩子document.onload或jQuery中$(document).load(...)。
工作小提琴上<body onload="myFunction()">
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
function myFunction(){
alert("Page is loaded");
}
</script>
</head>
<body onload="myFunction()">
<h1>Hello World!</h1>
</body>
</html><script type="text/javascript">
function downloadJSAtOnload() {
var element = document.createElement("script");
element.src = "defer.js";
document.body.appendChild(element);
}
if (window.addEventListener)
window.addEventListener("load", downloadJSAtOnload, false);
else if (window.attachEvent)
window.attachEvent("onload", downloadJSAtOnload);
else window.onload = downloadJSAtOnload;
</script>http://www.feedthebot.com/pagespeed/defer-loading-javascript.html
如果您使用的是jQuery，
$(function() {...});
相当于
$(document).ready(function () { })
或另一只短手：
$().ready(function () { })
document.onreadystatechange = function(){
if(document.readyState === 'complete'){
/*code here*/
}
}看这里：http : //msdn.microsoft.com/zh-cn/library/ie/ms536957(v=vs.85).aspx
<body onload="myFunction()">此代码运行良好。
但是window.onload方法具有各种依赖性。因此，它可能不会一直工作。
使用YUI库（我喜欢它）：
YAHOO.util.Event.onDOMReady(function(){
//your code
});便携美观！但是，如果您不将YUI用于其他内容（请参阅其文档），我会说不值得使用它。
注意：要使用此代码，您需要导入2个脚本
<script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/yahoo/yahoo-min.js" ></script>
<script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/event/event-min.js" ></script>关于如何检测使用Javascript或Jquery 加载文档的文档非常不错。
使用本机Javascript可以实现
if (document.readyState === "complete") {
init();
}这也可以在间隔内完成
var interval = setInterval(function() {
if(document.readyState === 'complete') {
clearInterval(interval);
init();
}
}, 100);switch (document.readyState) {
case "loading":
// The document is still loading.
break;
case "interactive":
// The document has finished loading. We can now access the DOM elements.
var span = document.createElement("span");
span.textContent = "A <span> element.";
document.body.appendChild(span);
break;
case "complete":
// The page is fully loaded.
console.log("Page is loaded completely");
break;
}使用Jquery仅检查DOM是否准备就绪
// A $( document ).ready() block.
$( document ).ready(function() {
console.log( "ready!" );
});要检查是否所有资源都已加载，请使用window.load
$( window ).load(function() {
console.log( "window loaded" );
});将此代码与jQuery库一起使用，效果会很好。
$(window).bind("load", function() {
// your javascript event
});$(window).on("load", function(){ ... });.ready（）最适合我。
$(document).ready(function(){ ... });.load（）可以使用，但是不会等到页面加载完毕。
jQuery(window).load(function () { ... });对我不起作用，中断了下一个内联脚本。我还使用jQuery 3.2.1以及其他一些jQuery分支。
要隐藏我的网站加载叠加层，我使用以下方法：
<script>
$(window).on("load", function(){
$('.loading-page').delay(3000).fadeOut(250);
});
</script>document.addEventListener('readystatechange', event => {
// When HTML/DOM elements are ready:
if (event.target.readyState === "interactive") { //does same as: ..addEventListener("DOMContentLoaded"..
alert("hi 1");
}
// When window loaded ( external resources are loaded too- `css`,`src`, etc...)
if (event.target.readyState === "complete") {
alert("hi 2");
}
});$(document).ready(function() { //same as: $(function() {
alert("hi 1");
});
$(window).load(function() {
alert("hi 2");
});注意： -不要使用下面的标记（因为它会覆盖其他相同类型的声明）：
document.onreadystatechange = ...asnyc脚本标记的我的advice使用属性可以帮助您在页面加载后加载外部脚本
<script type="text/javascript" src="a.js" async></script>
<script type="text/javascript" src="b.js" async></script>defer像@Daniel Price提到的那样？
使用自我执行onload函数
window.onload = function (){
/* statements */
}(); onload使用此方法覆盖其他处理程序。相反，您应该添加侦听器。