【前端知识】JavaScript——＜script＞的8个属性

**前端知识**

**JavaScript——＜script＞的8个属性**

在HTML中，＜script＞标签用于嵌入客户端脚本，如JavaScript。虽然＜script＞标签看起来很简单，但它实际上有八个重要的属性，可以帮助我们更好地组织和管理我们的脚本代码。

**1. async**

`async` 属性用于指定脚本是否异步执行。如果设置为 `true`，脚本将在页面加载完成后异步执行。否则，脚本将在页面加载完成前同步执行。

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

**2. charset**

`charset` 属性用于指定脚本的编码类型。如果不设置此属性，浏览器可能会使用默认编码（通常是 UTF-8）。

html<script charset="UTF-8" src="script.js"></script>

**3. defer**

`defer` 属性与 `async` 类似，但它指定脚本在页面加载完成后延迟执行，而不是异步执行。

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

**4. integrity**

`integrity` 属性用于指定脚本的哈希值，以便浏览器可以验证脚本是否被篡改或修改。

html<script integrity="sha256-..." src="script.js"></script>

**5. nomodule**

`nomodule` 属性用于指定脚本是否不支持模块（ES6+）。如果设置为 `true`，脚本将在不支持模块的浏览器中执行。

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

**6. nonce**

`nonce` 属性用于指定一个随机数值，以便浏览器可以验证脚本是否被篡改或修改。

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

**7. type**

`type` 属性用于指定脚本的类型。如果不设置此属性，浏览器可能会使用默认类型（通常是 `text/javascript`）。

html<script type="module" src="script.js"></script>

**8. crossorigin**

`crossorigin` 属性用于指定脚本是否可以跨域执行。可能的值包括 `"use-credentials"`、`"anonymous"` 和 `"none"`。

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

这些属性对于优化和安全地使用JavaScript至关重要。通过了解它们的作用，我们可以更好地组织我们的脚本代码，并确保它在不同浏览器中正确执行。

**参考**

* MDN Web Docs：＜script＞标签* W3Schools：JavaScript＜script＞属性