javascript - 延迟加载js如何？

Question

我在页面底部引用了以下 js 脚本：

<script src="http://example.com/test.js" type="text/javascript"></script>

Google PageSpeed 的建议是推迟加载这个 js。我不太明白如何做到这一点或后果。有人可以解释一下吗？

Answer 1

将属性添加defer到<script>标签应该可以做到。例如：

<script src="http://example.com/test.js" type="text/javascript" defer></script>

这个想法是文件中的脚本仅在整个页面加载完成后才执行，而不是标准的方式，即在浏览器解析标签后立即执行脚本（这可能会延迟标签后代码<script>的渲染）<script>.)

Answer 2

这些方法都不能真正保证执行。查看这篇很棒的文章，了解如何确保真正延迟了外部 javascript 执行。
feedthebot 延迟执行 javascript

由帕特里克·塞克斯顿撰写

Answer 3

您可以使用async属性

<script src="http://example.com/test.js" type="text/javascript" async></script>

笔记：

Internet Explorer 10、Firefox、Opera、Chrome 和 Safari 支持 async 属性。

Answer 4

这是您想要做的： http: //davidwalsh.name/html5-async

<script async src="siteScript.js" onload="myInit()"></script>

或者

<script defer src="siteScript.js" onload="myInit()"></script>

Answer 5

当一个 js 到另一个 js 存在依赖关系时，异步可能不是一个好的选择。例如。file1.js 依赖于 file2.js ，并且 file1.js 首先加载，开始执行但由于 file2.js 中的某些依赖项尚未加载而失败并引发错误。