在头中包含JS或在打开body标签后立即包含JS

Including JS in head or immediately after opening body tag

本文关键字：JS 包含 标签 body      更新时间：2023-09-26

在<head>中包含Javascript与在OPENING <body>标记之后立即包含有什么区别？

类似Facebook的小部件就是一个例子，他们建议在打开<body>标签后立即放置代码。SiteCatalyst也为他们的分析代码建议了这一点。

虽然在<head>元素中包含代码与在关闭</body>标签之前包含代码之间有明显的区别，但我不确定<head>和在打开<body>标签之后包含代码之间的区别是什么。

如果JavaScript在没有辅助函数（直接编写HTML）的情况下将某些内容输出到DOM中，那么将该JavaScript包含在<body>中是很重要的，但是在这种情况下应该没有区别，因为它就在<body>之后或</body>之前。

通常，任何依赖于加载的DOM的内容都会在</body>之前进行，因为在页面渲染到该点之前，不可能加载完整的DOM。我的猜测是，这些脚本不依赖于加载的DOM，但它们确实将HTML直接输出到DOM（比如隐藏的<input>标记或其他什么）。

当浏览器遇到脚本指令时，它会在处理页面的其余部分之前加载脚本。所以脚本越低越好。它可以在关闭body标签后立即进行，也可以在关闭之前进行。最好的方法是像这样异步加载它们（Google Analytics示例）：

(function() {
        var ga = document.createElement('script');
        ga.type = 'text/javascript';
        ga.async = true;
        ga.src = ('https:' == document.location.protocol 
          ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
        var s = document.getElementsByTagName('script')[0];
        s.parentNode.insertBefore(ga, s);
    })();
相关文章：