在HTML文档中嵌入JavaScript时,在哪里放置<script>标记和包含的JavaScript?我似乎记得,你不应该把这些放在<head>部分,但放在<body>部分的开头也是不好的,因为JavaScript必须在页面完全呈现之前进行解析(或类似的)。这似乎将<body>部分的结尾作为<script>标记的逻辑位置。

那么,哪里是放置<script>标记的正确位置?

(这个问题引用了这个问题,其中建议将JavaScript函数调用从<a>标记移动到<script>标记。我专门使用jQuery,但更一般的答案也是合适的。)


当前回答

现代方法是使用ES6“模块”类型脚本。

<script type="module" src="..."></script>

默认情况下,模块是异步和延迟加载的。即,您可以将它们放置在任何位置,它们将并行加载,并在页面完成加载时执行。

进一步阅读:

脚本和模块之间的区别与脚本相比,模块的执行被延迟(默认情况下模块被延迟)ES6模块的浏览器支持

其他回答

我认为这取决于网页的执行。

如果要显示的页面在未加载JavaScript的情况下无法正确显示,则应首先包含JavaScript文件。

但是,如果您可以在不下载JavaScript文件的情况下显示/呈现网页,那么应该将JavaScript代码放在页面底部。因为它将模拟快速的页面加载,并且从用户的角度来看,页面加载速度似乎更快。

事实证明,它无处不在。

您可以使用类似jQuery的方法来延迟执行,这样它放在哪里就不重要了(除了解析过程中的小性能影响)。

现代方法是使用ES6“模块”类型脚本。

<script type="module" src="..."></script>

默认情况下,模块是异步和延迟加载的。即,您可以将它们放置在任何位置,它们将并行加载,并在页面完成加载时执行。

进一步阅读:

脚本和模块之间的区别与脚本相比,模块的执行被延迟(默认情况下模块被延迟)ES6模块的浏览器支持

您可以将大多数<script>引用放在<body>的末尾。

但是,如果页面上有使用外部脚本的活动组件,那么它们的依赖项(.js文件)应该在前面(最好在head标记中)。

最保守(也被广泛接受)的答案是“在结束标记之前的底部”,因为这样,在任何东西开始执行之前,整个DOM都将被加载。

出于各种原因,有人持不同意见,首先是有意识地开始执行页面加载事件。