如何使JavaScript页面加载后执行?

我正在执行一个外部脚本，使用<脚本>内<头>。

现在，由于脚本在页面加载之前执行，我不能访问<body>等。我想在文档被“加载”(HTML完全下载并在ram中)后执行一些JavaScript。是否有任何事件，我可以挂钩到当我的脚本执行，这将在页面加载触发?

当前回答

我建议使用asnyc属性的脚本标签，这有助于你加载页面加载后的外部脚本

<script type="text/javascript" src="a.js" async></script>
<script type="text/javascript" src="b.js" async></script>

其他回答

您可以在特定的脚本文件上编写函数，并使用onload属性将其调用到body元素中。

示例:

<script>
  afterPageLoad() {
   //your code here
}
</script>

现在调用你的脚本到你的html页面使用script标签:

<script src="afterload.js"></script>

融入你的身体元素;像这样添加onload属性:

<body onload="afterPageLoad();">

document.onreadystatechange = function(){
     if(document.readyState === 'complete'){
         /*code here*/
     }
}

看这里:http://msdn.microsoft.com/en-us/library/ie/ms536957(v=vs.85).aspx

使用此代码与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>

如果你正在使用jQuery，

$(函数 () {...});

等于

美元(文档)。Ready (function () {})

或者另一个简写:

(美元)。Ready (function () {})

查看什么事件JQuery $function()火?和https://api.jquery.com/ready/

推荐文章