组合<头部>

combining inline scripts in <head>

本文关键字：头部 gt lt 组合      更新时间：2024-01-06

我的html部分有以下代码，我想知道如何清理它以优化加载。

<script type="text/javascript">
 function downloadJSAtOnload() {
 var element = document.createElement("script");
 element.src = "js/jquery.orbit-1.2.3.min.js";
 document.body.appendChild(element);
 }
 function downloadJSAtOnload() {
 var element = document.createElement("script");
 element.src = "http://code.jquery.com/jquery-latest.min.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的最后，就在关闭</body>标记之前：

<!-- ...content of page... -->
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script src="js/jquery.orbit-1.2.3.min.js"></script>
</body>
</html>

window对象上的load事件发生在页面加载过程的后期，在所有其他资源完全加载（或加载失败）之后。所以所有的图像，包括前景和背景等。

通过将脚本放在正文的末尾，可以在合理的时间将它们放入浏览器的下载队列，但不会让浏览器在进行初始页面渲染之前等待脚本到达。您还可以获得排序（通过script元素上的defer属性也可以获得排序，但并非所有浏览器都支持它）。更多：YUI加速网站的最佳实践

您在评论中询问了何时使用load事件加载脚本。我的答案是：我从来没有这样做的理由。

相关文章：