1. defer 属性：在 HTML 中通过设置 script 标签的 defer 属性来实现脚本的延迟加载，即脚本的下载与 HTML 的解析不会阻塞彼此，脚本会在 HTML 解析完成后才执⾏。
2. async 属性：在 HTML 中通过设置 script 标签的 async 属性来实现脚本的异步加载，即脚本的下载与 HTML 的解析不会阻塞彼此，脚本下载完成后会⽴即执⾏，但脚本执⾏时可能会阻塞 HTML 解析。<script src="test.js" async></script>
3. 动态加载脚本：通过 JavaScript 动态创建 script 标签，并设置其 src 属性来实现脚本的异步加载，这种⽅式需要在脚本加载完成后⼿动执⾏脚本。

var script = document.createElement('script');
script.src = 'test.js';
document.body.appendChild(script);

4. 懒加载模式：在需要时再加载脚本，可以使⽤ jQuery 等库实现，或者通过⾃⼰编写的函数来实现。
5. 让 JS 最后加载：将 <script> 放在⻚⾯内容的底部（即</body>前），也就是让浏览器从上到下解析完 HTML 后再加载 JS 脚本⽂件，从⽽起到延迟加载的作⽤。
6. 使⽤ Intersectionobserver API：可以在元素进⼊视窗时再加载脚本，实现延迟加载。

var observer = new IntersectionObserver(function (entries) {if (entries[0].isIntersecting) {var script = document.createElement("script");script.src = "test.js";document.body.appendChild(script);}},{ threshold: 0.5 }
);
var target = document.querySelector("#target");
observer.observe(target);

7. setTimeout ：设置⼀个定时器来延迟加载 JS 脚本⽂件。但是不好控制时间，不推荐使用。如果时间设置过⻓，会延迟⻚⾯的加载速度；如果时间设置过短，可能会在⻚⾯还没有完全加载完成时执⾏脚本，导致错误。