javascript - `script` 和 `link as="script"` 标签之间的区别

Question

除了加载脚本的标准方法：

<script src="js/script.js"></script>

我见过人们这样做：

<link href="js/script.js" as="script"> 

有什么区别吗？

---

注意：有一个类似的 使用链接和脚本标签引用 JavaScript 源有什么区别？问关于的问题<link href="script.js" type="text/javascript" />，这是不同的。

标签： javascripthtmlhead

Answer 1

如果该link标签上有rel="preload"（或rel="modulepreload"），则表示预加载请求，该请求将预加载但不运行脚本。相反，script加载并运行脚本。但是没有rel，那link是无效的并且没有有用的效果（至少在规范方面）。

如果您在规范中查找link，您将看到as列为：

as— 预加载请求的潜在目的地（forrel="preload"和rel="modulepreload"）

在指向属性的链接之后as，它说：

该as属性指定该属性给定资源的预加载请求的潜在目的地href。它是一个枚举属性。每个潜在目的地都是该属性的关键字，映射到同名状态。必须在具有包含关键字link的属性的元素上指定该属性。它可以在具有包含关键字的属性的元素上指定；在这种情况下，它必须有一个类似于脚本的目标值。对于其他元素，不得指定。relpreloadlinkrelmodulepreloadlink