屬性
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>