Javascript HTML 中多个 <script> 标签的含义
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4659409/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Implications of multiple <script> tags in HTML
提问by Philip
I have read that it is not recommended to instantiate jQuery multiple times in your HTML. This makes perfect sense to me, but: Isn't Javascript single-threaded anyway? And leaving jQuery behind, how does the browser execute these multiple script tags? In parallel or one after another?
我读过不建议在 HTML 中多次实例化 jQuery。这对我来说很有意义，但是：Javascript 不是单线程的吗？而抛开jQuery，浏览器是如何执行这些多个脚本标签的呢？并行还是一个接一个？
Thanks, Philip
谢谢，菲利普
回答by DVK
Simple answer:
简单回答：
In a simple scenario (tags are part of original HTML text), the browser definitely executes them one after another.
在一个简单的场景中（标签是原始 HTML 文本的一部分），浏览器肯定会一个接一个地执行它们。
Detailed discussion with different caveats
带有不同警告的详细讨论
JavaScript isn't necessarily single-threaded (it depends on the implementation of your JavaScript engine, e.g. see Web Workers).
JavaScript 不一定是单线程的（这取决于您的 JavaScript 引擎的实现，例如，参见Web Workers）。
BUT, the individual <script>tags are executed sequentially.
但是，各个<script>标签是按顺序执行的。
For reference, please see JavaScript: The Definitive Guide. Quoting Chapter "12.3. Execution of JavaScript Programs":
如需参考，请参阅JavaScript: The Definitive Guide。引用章节“12.3. JavaScript 程序的执行”：
JavaScript statements that appear between and tags are executed in order of appearance; when more than one script appears in a file, the scripts are executed in the order in which they appear. If a script calls document.write( ), any text passed to that method is inserted into the document immediately after the closing tag and is parsed by the HTML parser when the script finishes running. The same rules apply to scripts included from separate files with the src attribute.
出现在 和 标签之间的 JavaScript 语句按出现顺序执行；当一个文件中出现多个脚本时，这些脚本将按照它们出现的顺序执行。如果脚本调用 document.write()，则传递给该方法的任何文本都会在结束标记之后立即插入到文档中，并在脚本完成运行时由 HTML 解析器进行解析。相同的规则适用于从具有 src 属性的单独文件中包含的脚本。
Please note that the above is only true of "straight up" execution of code in tags. The order can, however, be affected by:
请注意，以上仅适用于“直接”执行标记中的代码。但是，订单可能会受到以下因素的影响：
setTimeout()calls (duh)Dynamic attachement of the
<script>tags - see the last section of this answer.
setTimeout()电话（废话）<script>标签的动态附加- 请参阅本答案的最后一部分。
As a caveat, please note that JavaScript code loaded externally via <script src="xxxx" />would still be executed sequentially, BUT, it is quite possible that the browser would DOWNLOADthe code in parallel - depends on browser implementation (but still schedule the execution of downloaded code snippets in correct order).
作为警告，请注意通过外部加载的 JavaScript 代码<script src="xxxx" />仍然会按顺序执行，但是，浏览器很可能会并行下载代码 - 取决于浏览器的实现（但仍会正确安排下载的代码片段的执行）命令）。
This caveat is important in case you want to have some weird hack whereas the URL for the JavaScript source is actually a CGI script which does something and you try to depend on the correct order of downloads for the logic in the script.
这个警告很重要，以防你想要一些奇怪的 hack，而 JavaScript 源的 URL 实际上是一个 CGI 脚本，它可以做一些事情，而你试图依赖于脚本中逻辑的正确下载顺序。
Again, it would have no bearing on your browser JS engine's execution order of those script pieces.
同样，它不会影响您的浏览器 JS 引擎对这些脚本片段的执行顺序。
However, a far more important caveatis that if you actually attach the <script>tags with external sources dynamically (e.g. via appendChild()call), according to this SO post, as well as the MSDN blog the post was based on, non-IE browsers do NOT guarantee the order of execution!It will depend on which tag's code finished downloading first!
但是，一个更重要的警告是，如果您实际上<script>动态地（例如通过appendChild()调用）附加带有外部源的标签，根据此 SO 帖子以及该帖子所基于的MSDN 博客，非 IE 浏览器不保证执行顺序！这将取决于哪个标签的代码首先完成下载！
回答by Sean Vieira
The fewer calls you make that instantiate a jQuery object, the less overhead you have -- but even if you are designing for old browsers running on 2nd generation hardware be wary of micro-optimizations. Profile your application and fix the parts that actuallyare the bottlenecks.
实例化 jQuery 对象的调用越少，开销就越小——但即使您是为在第二代硬件上运行的旧浏览器进行设计，也要警惕微优化。分析您的应用程序并修复实际上是瓶颈的部分。
As for the way browsers handle multiple script tags -- it varies from browser to browser, from version to version, and sometimes even from operating system to operating system. All browsers execute each script tag in document order:
至于浏览器处理多个脚本标签的方式——它因浏览器而异，因版本而异，有时甚至因操作系统而异。所有浏览器都按文档顺序执行每个脚本标签：
<script src="scripts/some_script.js"></script> <!-- Executed 1st -->
<script src="scripts/some_other_script.js"></script> <!-- Executed 2nd -->
<script>
// Some JavaScript
</script> <!-- Executed 3rd -->
<script>
// Some More JavaScript
</script> <!-- Executed 4th -->
However, other behaviors are not defined and there is variation. For example, Opera (at least on Windows XP for version 10.6) ran each script tag in its own context -- so local variables in the 3rd script block would be out of scope if referred to in the 4th script block.
但是，其他行为没有定义并且存在变化。例如，Opera（至少在 Windows XP 版本 10.6 上）在其自己的上下文中运行每个脚本标记——因此如果在第四个脚本块中引用，第三个脚本块中的局部变量将超出范围。
<script>
var i = 42;
</script>
<script>
alert(i);
// Alerts "undefined" in Opera, but 42 in Firefox.
</script>
回答by JasCav
The browser executes JavaScript sequentially (the same is true for jQuery since jQuery is just JavaScript).
浏览器按顺序执行 JavaScript（对于 jQuery 也是如此，因为 jQuery 只是 JavaScript）。
As for having multiple script tags in HTML, there's no reason why this would be a problem. As Nabab asked, I would be interested in seeing your source for that.
至于在 HTML 中有多个脚本标签，这没有任何问题。正如 Nabab 所问，我有兴趣查看您的消息来源。
回答by Andrew Weir
Doesn't the browser compile all the javascript anyway into one "file" during processing. For example, if you had multiple $(document).ready() calls across multiple files, when the browser pre-processes the page, it essentially condenses everything down for execution - and runs it sequentially in the order it was 'seen'.
浏览器在处理过程中不会将所有的 javascript 编译成一个“文件”。例如，如果您在多个文件中进行了多次 $(document).ready() 调用，那么当浏览器预处理页面时，它本质上会压缩所有内容以供执行 - 并按照“看到”的顺序依次运行它。
回答by Satyam Kumar
Yes, we can write any number of tags inside tag. And browser access them in sequential order.
是的，我们可以在标签内写入任意数量的标签。浏览器按顺序访问它们。
<html>
<body>
<!-- here your code-->
<script></script>
<script></script>
<script></script>
.
.
.
<script></script>
</body>
</html>
