javascript <script>标签 - 在src下载之前执行代码</script>

Question

在此代码段中

<script src="takes very long to download" type="text/javascript">
  alert('hi');
</script>

让我们假设脚本需要很长时间才能下载。在脚本下载完成之前，警报“hi”是否有可能触发？如果是，哪些浏览器可以这样做？   请注意，我故意将“alert（'hi'）”放在同一个标​​签内。

由于

Answer 1

alert('hi')永远不会触发，因为script标记支持内联代码 或 外部文件代码..

阅读http://www.w3.org/TR/html4/interact/scripts.html#h-18.2.1

上的规格

  

可以在外部文件中的SCRIPT元素或的内容中定义脚本。如果未设置src属性，则用户代理必须将该元素的内容解释为脚本。 如果src具有URI值，则用户代理必须忽略元素的内容并通过URI检索脚本。

Answer 2

没有。 src属性的存在将导致忽略元素的后代节点。

如果您有两个脚本元素，那么第二个脚本仍将始终执行第二个，因为脚本元素正在阻塞。

只有你有两个脚本元素，而第一个有defer or async attributes，第二个才能在第一个脚本元素之前执行。

Answer 3

如果您拥有以下代码并且不想在下载所有脚本之前触发警报（'hi'），则可以等待文档就绪事件。您可以使用jQuery或使用vanilla JavaScript来执行此操作。

<script src="takes very long to download" type="text/javascript"></script>
<script type="text/javascript">
   alert('hi');
</script>

推迟使用jQuery加载所有脚本：

$( document ).ready( function () { 
    alert('hi');
});

Answer 4

那是因为你无法导入这样的脚本并且在相同的脚本元素中运行javascript ...因为外部脚本会覆盖你写的javascript ....把它们放在不同的标签中...也用于更快的js import make a mock js src