script

  • 用于嵌入或引用可执行脚本。

属性

  • 该元素包含全局属性

async

  • 该布尔属性指示浏览器是否在允许的情况下异步执行该脚本。该属性对于内联脚本无作用 (即没有src属性的脚本)。
  • 如果浏览器不支持这个属性,该JS将变为顺序执行,阻碍浏览器解析HTML
  • 异步脚本中document.write是无效的

defer

  • 这个布尔属性被设定用来通知浏览器该脚本将在文档完成解析后,触发 DOMContentLoaded 事件前执行。
  • 如果缺少 src 属性(即内嵌脚本),该属性不应被使用,因为这种情况下它不起作用。
  • 对动态嵌入的脚本使用 async=false 来达到类似的效果。
    • 通过脚本嵌入的脚本会自动设置async为true来使插入的脚本异步执行

crossorigin

  • 提供了对 CORS 的支持<script src="" crossorigin="anonymous"></script>
  • 具有以下可能的值:
    • anonymous 对此元素的CORS请求将不设置凭据标志。不会通过 cookies,客户端 SSL 证书或 HTTP 认证交换用户凭据。即使是无效的关键字和空字符串也会被当作 anonymous 关键字使用。
    • use-credentials 对此元素的CORS请求将设置凭证标志; 这意味着请求将提供凭据。

integrity

  • 包含用户代理可用于验证已提取资源是否已无意外操作的内联元数据。(用来验证当前资源的资源完整性?)
  • integrity 值分成两个部分,第一部分指定哈希值的生成算法(目前支持 sha256、sha384 及 sha512),第二部分是经过 base64 编码的实际哈希值,两者之间通过一个短横(-)分割。sha384-oqVuAfXRKap7fdgcCY5uykM6+R9GqQ8K/uxy9rx7HNQlGYl1kPzQho1wx4JwY8wC
  • 当脚本或者样式表的哈希值和期望的不一致时,浏览器必须拒绝执行脚本或者应用样式表,并且必须返回一个网络错误说明获得脚本或样式表失败。

nomodule

  • This Boolean attribute is set to indicate that the script should not be executed in browsers that support ES2015 modules — in effect, this can be used to serve fallback scripts to older browsers that do not support modular JavaScript code.(在不支持模块化JS的浏览器才会执行拥有该标志的JS代码)

nonce

  • A cryptographic nonce (number used once) to whitelist inline scripts in a script-src Content-Security-Policy. (白名单标志)https://www.cnblogs.com/qq3279338858/p/11104192.html
  • The server must generate a unique nonce value each time it transmits a policy. (服务器每次传输策略时必须生成唯一的nonce值。)
<script nonce=EDNnf03nceIOfn39fn3e9h3sdfa src=''></script>

Content-Security-Policy: script-src 'nonce-EDNnf03nceIOfn39fn3e9h3sdfa' // 响应头,指明了nonce白名单包括范围

referrerpolicy

  • Indicates which referrer to send when fetching the script, or resources fetched by the script:(指示在获取脚本或脚本获取的资源时要发送的referer:)
    • no-referrer: The Referer header will not be sent.(不发送)
    • no-referrer-when-downgrade (default): The Referer header will not be sent to origins without TLS (HTTPS).(只有HTTPS链接才发送)
    • origin: The sent referrer will be limited to the origin of the referring page: its scheme, host, and port.(同域才发,只发送域名+端口)
    • origin-when-cross-origin: The referrer sent to other origins will be limited to the scheme, the host, and the port. Navigations on the same origin will still include the path.(只有同域时才发,且只发路径)
    • same-origin: A referrer will be sent for same origin, but cross-origin requests will contain no referrer information.(同域发送,包括全路径?)
    • strict-origin: Only send the origin of the document as the referrer when the protocol security level stays the same (e.g. HTTPS→HTTPS), but don't send it to a less secure destination (e.g. HTTPS→HTTP).(只有HTTPS→HTTPS才发送)
    • unsafe-url: The referrer will include the origin and the path (but not the fragment, password, or username). This value is unsafe, because it leaks origins and paths from TLS-protected resources to insecure origins.(随时都发全路径,不包括账号密码,不推荐)
  • If referrerpolicy is not explicitly specified on the <script> element, it will adopt a higher-level referrer policy, i.e. one set on the whole document or domain.(如果script标签上未设置该属性,将采用整个文档上的该策略,meta 标签中)

src

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

type

  • 该属性定义script元素包含或src引用的脚本语言。
  • 属性的值为MIME类型; 支持的MIME类型包括(H5不需要)
    • text/javascript(老版IE的兼容问题)
    • text/ecmascript
    • application/javascript
    • application/ecmascript
  • 如果没有定义这个属性,脚本会被视作JavaScript
  • 如果MIME类型不是JavaScript类型(上述支持的类型),则该元素所包含的内容会被当作数据块而不会被浏览器执行
    • 如果type属性为module,代码会被当作JavaScript模块(实验阶段)

text

  • 用于设置元素的文本内容,在节点插入到DOM之后,此属性被解析为可执行代码。‘

示例

Module fallback(模块兼容)

<script type="module" src="main.mjs"></script>
<script nomodule src="fallback.js"></script>
原文地址:https://www.cnblogs.com/qq3279338858/p/11044329.html