我正在执行一个外部脚本,使用<脚本>内<头>。
现在,由于脚本在页面加载之前执行,我不能访问<body>等。我想在文档被“加载”(HTML完全下载并在ram中)后执行一些JavaScript。是否有任何事件,我可以挂钩到当我的脚本执行,这将在页面加载触发?
我正在执行一个外部脚本,使用<脚本>内<头>。
现在,由于脚本在页面加载之前执行,我不能访问<body>等。我想在文档被“加载”(HTML完全下载并在ram中)后执行一些JavaScript。是否有任何事件,我可以挂钩到当我的脚本执行,这将在页面加载触发?
当前回答
Working Fiddle on <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>
其他回答
$(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>
我建议使用asnyc属性的脚本标签,这有助于你加载页面加载后的外部脚本
<script type="text/javascript" src="a.js" async></script>
<script type="text/javascript" src="b.js" async></script>
这是一个基于延迟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>
我该把它放在哪里?
将代码粘贴到</body>标记之前(靠近HTML文件的底部)。
它能做什么?
此代码表示等待整个文档加载,然后加载 外部文件deferredfunctions.js。
这是上面代码的一个例子- JS的延迟渲染
我写这个基于延迟加载javascript页面速度谷歌的概念,也从这篇文章延迟加载javascript
正如Daniel所说,您可以使用document.onload。
然而,各种javascript框架(jQuery, Mootools等)使用一个自定义事件'domready',我猜这一定是更有效的。如果你使用javascript进行开发,我强烈建议你使用框架,这将极大地提高你的工作效率。
< script type = " text / javascript " > 美元(窗口)。绑定("load", function() { // javascript事件 }); > < /脚本