主流浏览器中 JavaScript <script> 标签执行顺序不能保证吗？

Question

主流浏览器中 JavaScript <script> 标签执行顺序不能保证吗？

29

在主流浏览器中，以下脚本标签是否总是按照声明的顺序连续执行？也就是说，我是否应该假设以下代码不会总是在 alert 中输出 x == 'ab'？

<head>
    <script type="text/javascript">
      //tag A
      var x = x || ''; x += 'a';
    </script>
    <script type="text/javascript">
      //tag B
      var x = x || ''; x += 'b';
    </script>
</head>
<body>
    <script type="text/javascript">
       alert('x='+x);
    <script>
</body>

...并且x有可能是以下之一：

'ba' - 如果标记B在A之前执行
'a'或'b' - A和B同时执行的竞态条件（尽管此线程明确表示浏览器只分配单个JS线程）

- Nikita

2

我熟悉这是有关于链接JS源文件的问题，但对于在问题中定义的脚本块则不然。例如：<script src="...."></script><script>依赖于先前链接文件的代码</script>会在十次中有九次失败（缓存的js文件为10分之1）。 - Jonathan Fingland

2

浏览器绝对应该按顺序依次执行这些脚本。你的经验与此相反吗？ - Bryan Kyle

4

对于链接的JavaScript文件来说，除非它们使用async或defer属性，或者自己编写/添加其他脚本，否则这也不是问题。 - bobince

1

必读：http://html5rocks.com/en/tutorials/speed/script-loading - Pacerier

我也遇到了JonathanFingland描述的情况("<script src="...."></script><script>依赖于先前链接文件的代码</script>") - src正在加载jQuery，下面的脚本块依赖它 - 但是发现$未定义。在脚本块代码周围添加了一个setTimeout(..., 0)来给jQuery加载时间 - 运行正常。所以这里发生了一些意料之外的事情。 - Heinrich Ulbricht

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- ChristopheD · Accepted Answer

这些非动态添加的 script 标签的执行顺序在每个浏览器中应该是纯粹按顺序执行：

摘自此链接：link

出现在 <script> 和 </script> 标签之间的 JavaScript 语句将以它们的出现顺序进行执行；当一个文件中出现多个脚本时，这些脚本将按它们出现的顺序执行。

然而，一旦你：

通过自己的代码触发异步处理（不是本示例中）
动态添加脚本标签
使用 defer 属性.

事情可能会改变。