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

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


当前回答

如果脚本是在文档的<head>中加载的,那么可以在script标记中使用defer属性。

例子:

<script src="demo_defer.js" defer></script>

从https://developer.mozilla.org:

推迟 此布尔属性被设置为向浏览器指示脚本 意味着在解析文档之后执行,但在解析之前 发射DOMContentLoaded。内 如果src 属性不存在(即对于内联脚本),在这种情况下它会 没有效果。 为实现动态插入脚本使用的类似效果 异步= 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>

我该把它放在哪里?

将代码粘贴到</body>标记之前(靠近HTML文件的底部)。

它能做什么?

此代码表示等待整个文档加载,然后加载 外部文件deferredfunctions.js。

这是上面代码的一个例子- JS的延迟渲染

我写这个基于延迟加载javascript页面速度谷歌的概念,也从这篇文章延迟加载javascript

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

示例:

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

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

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

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

<body onload="afterPageLoad();">

你可以在主体中放置一个“onload”属性

...<body onload="myFunction()">...

或者如果您正在使用jQuery,您也可以这样做

$(document).ready(function(){ /*code here*/ }) 

or 

$(window).load(function(){ /*code here*/ })

我希望它能回答你的问题。

注意$(窗口)。加载将在页面上呈现文档之后执行。

<body onload="myFunction()">

这段代码运行良好。

但窗口。Onload方法有各种依赖关系。所以它可能不会一直有效。

这些解决方案是有效的:

正如注释中提到的,使用defer:

<script src="deferMe.js" defer></script>

or

<body onload="script();">

or

document.onload = function ...

甚至

window.onload = function ...

请注意,最后一个选项是更好的方法,因为它不引人注目,而且被认为更标准。