<script>
Baseline
Widely available
*
This feature is well established and works across many devices and browser versions. Itâs been available across browsers since 2015å¹´7æ.
* Some parts of this feature may have varying levels of support.
HTML <script> å
ç´ è½åµå
¥æå¼ç¨è¦å·è¡çç¨å¼ç¢¼ãæå¸¸è¦çç¨éæ¯åµå
¥æå¼ç¨ JavaScript ç¨å¼ç¢¼ã<script> å
ç´ ä¹è½å·è¡å
¶ä»èªè¨ï¼ä¾å¦ WebGL ç GLSL shader ç¨å¼èªè¨ã
| å §å®¹é¡å | å è³æå §å®¹ãæµåå §å®¹ãPhrasing content. |
|---|---|
| å 許çå §å®¹ | åæ
è
³æ¬å¦ text/javascript. |
| æ¨ç±¤çç¥ | ä¸å 許ï¼éå§åçµææ¨ç±¤é½æ¯å¿ é çã |
| å 許çç¶å ç´ | ä»»ä½å¯æ¥å å è³æå §å®¹æ phrasing content çå ç´ ã |
| å 許ç ARIA role | None |
| DOM ä»é¢ | HTMLScriptElement |
屬æ§
æ¤å ç´ å å«äºå ¨å屬æ§ã
async-
éå叿屬æ§å訴ç覽å¨èªªï¼å¦æå¯ä»¥ï¼å°±ä»¥éåæ¥çæ¹æ³å·è¡è ³æ¬ã
è¦åï¼å¦ææ²æ
src屬æ§ç話ï¼å°±ä¸è½ç¨éå屬æ§ï¼ä¾å¦è¡å §è ³æ¬ï¼ï¼å¨éç¨®æ æ³ä¸ï¼å®å°å¤±å»ä½ç¨ã async-
å¨ HTML è§£ææï¼ç覽å¨é常æå宿å£çæ æ³ï¼ä¸¦åæ¥å°è¼å ¥è ³æ¬ï¼ä¾å¦
async=falseï¼ãåæ æå ¥çè ³æ¬ï¼ä¾å¦
document.createElementï¼ä¸è¬ä¾èªªæ¯é忥å·è¡çãå æ¤ï¼å¦æè¨å®åæ¥ç話ï¼è ³æ¬æç §è¢«æå ¥çé åºå·è¡ï¼ï¼æè¢«è¨çºasync=falseãè«åè¦ç¸å®¹æ§è¨»è§£ççè¦½å¨æ¯æ´å註ãå¦è«åè¦ Async scripts for asm.jsã
crossorigin-
éå°æ²æééæ¨æº CORS çä¸è¬
scriptå ç´ ï¼æææå°çè³è¨å³çµ¦window.onerrorãè¥è¦å 許å¦ä¸åååç«é»çéæ å §å®¹ï¼ååºé¯èª¤è¨æ¯ï¼è«ä½¿ç¨æ¤å±¬æ§ãè«åè¦ CORS settings attributes 以以åå¾å°å ¶ææåæ¸çï¼æ´å ·æè¿°æ§çè§£éã defer-
è¨ç½®æ¤ Boolean attribute æ¯çºäºæç¤ºç覽å¨ï¼è ³æ¬æå¨ document è§£æå¾ï¼ä½å¨è§¸ç¼
DOMContentLoadedä¹å被å·è¡ãå ·ædefer屬æ§çè ³æ¬å°é»æ¢è§¸ç¼DOMContentLoadedäºä»¶ï¼ç´å°è ³æ¬ load å®æä¸¦ä¸ finished evaluatingãè¦åï¼å¦ææ²æ
src屬æ§ç話ï¼å°±ä¸è½ç¨éå屬æ§ï¼ä¾å¦è¡å §è ³æ¬ï¼ï¼å¨éç¨®æ æ³ä¸ï¼å®å°å¤±å»ä½ç¨ãThedeferattribute has no effect on module script â they defer by default. fetchpriority-
Scripts with the
deferattribute will execute in the order in which they appear in the document.This attribute allows the elimination of parser-blocking JavaScript where the browser would have to load and evaluate scripts before continuing to parse.asynchas a similar effect in this case. integrity-
This attribute contains inline metadata that a user agent can use to verify that a fetched resource has been delivered free of unexpected manipulation. See Subresource Integrity.
nomodule-
éå叿屬æ§ï¼æè¦æ±æ¯æ´ ES2015 modules çç覽å¨ï¼ä¸å·è¡è£¡é¢çç¨å¼ãéè½ç¨ä¾çµ¦ä¸æ¯æ´ JavaScript 模çµçèèç覽å¨ï¼æä¾ç¨æ¼å䏿¯æ´çæåã
nonce-
A cryptographic nonce (number used once) to whitelist inline scripts in a script-src Content-Security-Policy. The server must generate a unique nonce value each time it transmits a policy. It is critical to provide a nonce that cannot be guessed as bypassing a resource's policy is otherwise trivial.
src-
æ¤å±¬æ§æå®å¤é¨ç¨å¼ç URIï¼å¯ä»¥ç¨ä¾åä»£ç´æ¥å¨æä»¶å §ä¸åµå ¥è ³æ¬ã
è¦åï¼å¦æ
scriptå ç´ ææå®src屬æ§çè©±ï¼æ¨ç±¤å §å°±ä¸è½æåµå ¥çè ³æ¬ã text-
Like the
textContentattribute, this attribute sets the text content of the element. Unlike thetextContentattribute, however, this attribute is evaluated as executable code after the node is inserted into the DOM. type-
æ¤å±¬æ§æå®ç¨å¼ç¢¼æè©²è¡¨ç¤ºçé¡åãæ¤å±¬æ§ç弿屬æ¼ä»¥ä¸é¡å¥ä¹ä¸ï¼çç¥æ JavaScript MIME é¡åï¼éå°ç¸å®¹ HTML5 çç覽å¨ä¾èªªï¼å ç´ å §æå·è¡ JavaScriptãHTML5 è¦ç¯æ¦ä¿ä½è çç¥æ¤å±¬æ§ï¼ä¸éè¦å¯«åé·ç MIME é¡åã卿©æçç覽å¨ä¸ï¼é確å®äºåµå ¥æå¼å ¥ï¼éé
src屬æ§ï¼è ³æ¬çèªè¨ãJavaScript MIME é¡åæåå¨è¦ç¯å §ãmoduleï¼éå°ç¸å®¹ HTML5 çç覽å¨ä¾èªªï¼é段ç¨å¼ç¢¼æç¶æ JavaScript 模çµï¼moduleï¼ãè ³æ¬å §å®¹çèçä¸åcharsetèdefer屬æ§å½±é¿ãéå°moduleçè³è¨ï¼è«åé± ES6 in Depth: Modulesãå¨ä½¿ç¨moduleééµåæï¼ç¨å¼ç¢¼çè¡çºæææä¸åã- å
¶ä»å¼ï¼åµå
¥çå
§å®¹æè¢«ç¶æä¸æ®µä¸çµ¦ç覽å¨å·è¡çè³æå¡ï¼data blockï¼ãéç¼è
æç¶ä½¿ç¨é JavaScript çææ MIME é¡åï¼ä»¥æ¨æè³æå¡ã
src屬æ§ä¹å°è¢«å¿½ç¥ã
å註ï¼å¨ Firefox ä½ å¯ä»¥å¨
<script>å ç´ çtype屬æ§ï¼é鿍æéæ¨æºåæ¸versionï¼æå®è¦ä½¿ç¨ç JavaScript çæ¬ï¼ä¾å¦èªªtype="application/javascript;version=1.8"ãéååè½å¨ Firefox 59 ç§»é¤äºï¼è«åè¦ Firefox bug 1428745ï¼ã
æ£ç¨å±¬æ§
language-
å¦å
type屬æ§ï¼æ¤å±¬æ§æå®æ£å¨ä½¿ç¨çè ³æ¬èªè¨ãä½ètype屬æ§ä¸åï¼æ¤å±¬æ§çå¯ç¨å¼å¾æªæ¨æºåãæç¶ä½¿ç¨type屬æ§ã
註解
Scripts without async or defer attributes, as well as inline scripts, are fetched and executed immediately, before the browser continues to parse the page.
The script should be served with the text/javascript MIME type, but browsers are lenient and only block them if the script is served with an image type (image/*); a video type (video/*); an audio (audio/*) type; or text/csv. If the script is blocked, an error is sent to the element, if not a load event is sent.
示ä¾
>åºæ¬
以ä¸ç¤ºä¾å±ç¤ºå¦ä½å¨ HTML4 è HTML5 ä½¿ç¨ <script> 屬æ§ã
<!-- HTML4 è (x)HTML -->
<script type="text/javascript" src="javascript.js"></script>
<!-- HTML5 -->
<script src="javascript.js"></script>
模çµçå䏿¯æ´æ¹æ¡
æéå° type å±¬æ§æ¯æ´ moduleï¼æ¨¡çµï¼çç覽å¨ï¼æå¿½ç¥ nomodule 屬æ§çç¨å¼ç¢¼ãéè½è®é£äºä¸æ¯æ´æ¨¡çµçç覽å¨ï¼æä¾æ¿ä»£çä½¿ç¨æ¹æ³ã
<script type="module" src="main.mjs"></script>
<script nomodule src="fallback.js"></script>
è¦ç¯
| Specification |
|---|
| HTML > # the-script-element > |
ç覽å¨ç¸å®¹æ§
ç¸å®¹æ§è¨»è§£
In older browsers that don't support the async attribute, parser-inserted scripts block the parser; script-inserted scripts execute asynchronously in IE and WebKit, but synchronously in Opera and pre-4 Firefox. In Firefox 4, the async DOM property defaults to true for script-created scripts, so the default behaviour matches the behaviour of IE and WebKit.
To request script-inserted external scripts be executed in the insertion order in browsers where the document.createElement("script").async evaluates to true (such as Firefox 4), set .async=false on the scripts you want to maintain order.
è¦åï¼Never call document.write() from an async script. In Firefox 3.6, calling document.write() has an unpredictable effect. In Firefox 4, calling document.write() from an async script has no effect (other than printing a warning to the error console).