Question

给出一个带有autoexec函数语法的外部javascript文件：

// external-script.js
(function() {
  console.log('external script called');
}());

使用以下<script>标记，外部脚本不会执行：

<body>
  // ...
  <script src="external-script.js" type="text/javascript" />
</body>

但是如果我添加一个空的<script>块，如下所示，那么外部脚本会自动执行。

<body>
  // ...
  <script src="external-script.js" type="text/javascript" />
  <script>
    // empty
  </script>
</body>

为什么添加空<script>块会触发自动执行？

Answer 1

使用/>的“自动关闭”脚本标记不是有效的HTML语法。相反，您必须始终使用<script></script>。

<script src="external-script.js" type="text/javascript"></script>

您的第二个示例中发生的是您正在创建一个以<script>//empty作为其内容的单个脚本标记，但这会被忽略，因为它将运行src属性中的代码。

实际上，HTML解析器只是忽略open-tags中的所有/。相反，某些标记始终被视为没有内容的空白元素（因此<img>不需要匹配</img>。

有关详细信息，请参阅Are (non-void) self-closing tags valid in HTML5?。请记住，HTML5基本上只是一个记录HTML解析器一直在做的zany行为的标准。