HTML元素用于嵌入或引用可执行脚本。

浏览器支持

示例

document.write("hello world!") 

标签定义及使用说明

• 标签用于定义客户端脚本，比如 JavaScript。通常用于图像操作、表单验证以及动态内容更改。元素既可包含脚本语句，也可以通过"src"属性指向外部脚本文件。如果使用"src"属性，则元素必须是空的。请参阅元素，对于那些在浏览器中禁用脚本或者其浏览器不支持客户端脚本的用户来说，该元素非常有用。
• 如果 async="true"：脚本相对于页面的其余部分异步地执行（当页面继续进行解析时，脚本将被执行）。如果不使用 async 且 defer="defer"：脚本将在页面完成解析时执行。如果既不使用 async 也不使用 defer：在浏览器继续解析页面之前，立即读取并执行脚本
• 如果 async 属性为true，则脚本会相对于文档的其余部分异步执行，这样脚本会可以在页面继续解析的过程中来执行。如果 async 属性为false，而 defer 属性为 true，则脚本会在页面完成解析时得到执行。如果 async 和 defer 属性均为 false，那么脚本会立即执行，页面会在脚本执行完毕继续解析。

属性

指明响应的脚本类型。它可能属于以下类别中的一个。

• asyncHTML5
  该布尔属性指示浏览器是否在允许的情况下异步执行该脚本。该属性对于内联脚本无作用(即没有src属性的脚本）。
• crossorigin那些没有通过标准CORS检查的正常script元素传递最少的信息到window.onerror。可以使用本属性来使那些将静态资源放在另外一个域名的站点打印错误信息。参考CORS 设置属性了解对有效参数的更具描述性的解释。

• defer这个布尔属性被设定用来通知浏览器该脚本将在文档完成解析后，触发DOMContentLoaded事件前执行。如果缺少src属性（即内嵌脚本），该属性不应被使用，因为这种情况下它不起作用。对动态嵌入的脚本使用async=false来达到类似的效果。
• integrity包含用户代理可用于验证已提取资源是否已无意外操作的内联元数据。
• nomodule这个布尔属性被设置来标明这个脚本在支持ES2015 modules的浏览器中不执行。—实际上，这可用于在不支持模块化JavaScript的旧浏览器中提供回退脚本。
• nonce加密nonce（一次使用的数字），用于在ascript src Content安全策略中列出内联脚本。服务器每次传输策略时都必须生成唯一的nonce值。提供一个不能被猜测为绕过资源策略的nonce是很重要的，否则就很简单了。
• refererpolicy指示在获取脚本时要发送哪个referrerto，或者脚本获取的资源：
  • no-referrer：不会发送引用者头。
  • no-referrer-when-downgrade（默认值）：不会将引用者头发送到没有outtls（HTTPS）的rigins。
  • origin:发送的引用将限于引用页的来源：它的方案、主机和端口。
  • origin-when-cross-origin:发送到其他来源的推荐将仅限于方案、主机和端口。在同一原点上的导航仍将包括路径。
  • same-origin:将为同一来源发送一个推荐人，但跨来源请求将不包含推荐人信息。
  • strict-origin:仅当协议安全级别保持不变（例如HTTPS→HTTPS）时，才将文档的源作为引用发送，但不要将其发送到不太安全的目标（例如HTTPS→HTTP）。
  • strict-origin-when-cross-origin:执行同一来源请求时发送完整的URL，但仅在协议安全级别保持不变（例如HTTPS→HTTPS）时发送来源，并且不向不太安全的目的地发送头（例如HTTPS→HTTP）。
  • unsafe-url:引用程序将包括源和路径（但不包括碎片、密码或用户名）。此值不安全，因为它将源和路径从受TLS保护的资源泄漏到不安全的源。

  注意:空字符串值（""）既是默认值，又referrerpolicy是不支持的后备值。如果referrerpolicy未在元素上明确指定，它将采用更高级别的引荐来源网址策略，即在整个文档或域上设置一个引荐策略。如果没有更高级别的策略，则将空字符串视为等效于no-referrer-when-downgrade。

• src这个属性定义引用外部脚本的URI，这可以用来代替直接在文档中嵌入脚本。指定了 src 属性的script元素标签内不应该再有嵌入的脚本。
• type

  该属性定义script元素包含或src引用的脚本语言。属性的值为MIME类型；支持的MIME类型包括text/javascript,text/ecmascript,application/javascript,和application/ecmascript。如果没有定义这个属性，脚本会被视作JavaScript。

  如果MIME类型不是JavaScript类型（上述支持的类型），则该元素所包含的内容会被当作数据块而不会被浏览器执行。

  如果type属性为module，代码会被当作JavaScript模块。请参见ES6 in Depth: Modules

  在Firefox中可以通过定义type=application/javascript;version=1.8来使用如let声明这类的JS高版本中的先进特性。但请注意这是个非标准功能，其他浏览器，特别是基于Chrome的浏览器可能会不支持。

  关于如何引入特殊编程语言，请参见这篇文章。

• text和 textContent 属性类似，本属性用于设置元素的文本内容。但和 textContent不一样的是，本属性在节点插入到DOM之后，此属性被解析为可执行代码。

不推荐使用的属性

• charset如果存在，则其值必须与“utf-8”的ASCII不区分大小写匹配。两者都不需要指定字符集属性，因为文档必须使用UTF-8，并且脚本元素从文档继承其字符编码。
• language和type属性类似，这个属性定义脚本使用的语言。但是与type不同的是，这个属性的可能值从未被标准化过。请用type属性代替这个属性。

属性

HTML 4.01 与 HTML 5 之间的差异

在 HTML 5 中，有一些新属性，同时不再支持 HTML 4.01 中的一些属性。

在 HTML 4 中，"type"属性是必需的，但在 HTML5 中是可选的。

HTML5 中不再支持 HTML 4.01 中的某些属性："xml:space"。"async"属性是 HTML5 中的新属性。

HTML 与 XHTML 之间的差异

在 XHTML 中，脚本中的内容类型声明为#PCDATA（代替 CDATA），就是说会对实体进行解析。这意味着，在 XHTML 中，应该编码所有特殊的字符，或者把所有内容嵌套在 CDATA 部分中：

//

全局属性

标签支持HTML 的全局属性。

例子

通过 JavaScript 输出"Hello world"：

document.write("hello world!")

Basic usage

These examples show how to import script using theelement in both HTML4 and HTML5.

Module fallback

Browsers that support themodulevalue for thetypeattribute ignore any script with anomoduleattribute. That enables you to use module scripts while also providingnomodule-marked fallback scripts for non-supporting browsers.

鹏仔微信 15129739599 鹏仔QQ344225443 鹏仔前端 pjxi.com 共享博客 sharedbk.com