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 值分紅兩個部分,第一部分指定哈希值的生成算法(目前支持 sha25六、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>
相關文章
相關標籤/搜索