我见过两种方式，两种实现方式都可以工作，只是结构有点不同。根据您的经验，哪个效果更好，为什么？
我应该在正文中还是在 html 的头部编写脚本？
IT技术
javascript
html
2021-02-09 19:25:35
5个回答
我实际上会用多个选项来回答这个问题，其中一些实际上在正文中呈现。
- 将库脚本如 jQuery 库放在 head 部分。
- 将普通脚本放在头部，除非它成为性能/页面加载问题。
- 将与包含相关联的脚本放置在包含的内部和末尾。一个例子是asp.net 页面中的.ascx 用户控件——将脚本放在该标记的末尾。
- 将影响页面渲染的脚本放置在正文的末尾（在正文关闭之前）。
- 不要将脚本放在标记中，例如
<input onclick="myfunction()"/>- 最好将它放在脚本正文中的事件处理程序中。 - 如果你不能决定，把它放在脑子里，直到你有理由不这样做，比如页面阻塞问题。
脚注：“当你需要它而不是事先”适用于页面阻塞时的最后一项（感知加载速度）。用户的感知就是他们的现实——如果它被认为加载得更快，它确实加载得更快（即使代码中可能仍在发生一些事情）。
编辑：参考：
- asp.net 讨论：http : //west-wind.com/weblog/posts/154797.aspx和这里：http : //msdn.microsoft.com/en-us/library/3hc29e2a.aspx
- jQuery 文档就绪讨论：http : //encosia.com/2010/08/18/dont-let-jquerys-document-ready-slow-you-down/?utm_source=feedburner&utm_medium=email&utm_campaign=Feed%3A+Encosia+%28Encosia% 29
- 关于这个问题的其他答案也提供了有效的信息。
- 使用 www.google.com 和 www.bing.com 搜索相关信息（有很多参考资料）
附注：如果您放置标记内脚本块，它可能在某些浏览器的占用空间影响布局（IE7和歌剧9.2，已知有这个问题），所以将它们装入隐藏DIV（使用一个CSS类，如：.hide { display: none; visibility: hidden; }上div)
标准：请注意，如果有问题，标准允许将脚本块放置在几乎任何地方： http: //www.w3.org/TR/1999/REC-html401-19991224/sgml/dtd.html和http:// www.w3.org/TR/xhtml11/xhtml11_dtd.html
EDIT2：请注意，只要有可能（总是？），您应该将实际的 Javascript 放在外部文件中并引用这些文件 - 这不会改变相关序列的有效性。
在页面开头编写脚本的问题是阻塞。浏览器必须停止处理页面，直到脚本被下载、解析和执行。原因很明显，这些脚本可能会在页面中插入更多内容来更改渲染结果，它们也可能会删除不需要渲染的内容等。
一些更现代的浏览器违反了这一规则，不阻止下载脚本（即 8 是第一个），但总体而言，下载并不是花费在阻止上的大部分时间。
查看甚至更快的网站，我刚刚读完它，它介绍了将脚本放到页面上的所有快速方法，包括将脚本放在页面底部以完成渲染（更好的 UX）。
头，或在身体标签关闭之前。然后执行 DOM 加载 JS 时，这正是 jQuery document.ready 所做的。
我总是把我的脚本放在标题中。我的理由：
- 我喜欢将代码和（静态）文本分开
- 我通常从外部资源加载我的脚本
- 多个页面使用了相同的脚本，因此感觉就像一个包含文件（也在标题中）
其它你可能感兴趣的问题