HTML <script>
元素用于嵌入或引用可执行脚本。
内容分类 | Metadata content, Flow content, Phrasing content. |
---|---|
可用内容 | 动态脚本,如 text/javascript . |
标签省略 | 不允许,开始标签和结束标签都不能省略。 |
可用父元素 | Any element that accepts metadata content, or any element that accepts phrasing content. |
允许的 ARIA 角色 | 无 |
DOM接口 | HTMLScriptElement |
属性
该元素包含全局属性。
指明响应的脚本类型。它可能属于以下类别中的一个。
async
HTML5- 该布尔属性指示浏览器是否在允许的情况下异步执行该脚本。该属性对于内联脚本无作用 (即没有src属性的脚本)。
- 关于浏览器支持请参见浏览器兼容性。另可参见文章asm.js的异步脚本。
defer
- 这个布尔属性被设定用来通知浏览器该脚本将在文档完成解析后,触发
DOMContentLoaded
事件前执行。如果缺少src
属性(即内嵌脚本),该属性不应被使用,因为这种情况下它不起作用。对动态嵌入的脚本使用 `async=false` 来达到类似的效果。 integrity
- 包含用户代理可用于验证已提取资源是否已无意外操作的内联元数据。参见 Subresource Integrity。
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之后,此属性被解析为可执行代码。
language
- 和type属性类似,这个属性定义脚本使用的语言。 但是与type不同的是,这个属性的可能值从未被标准化过。请用
type
属性代替这个属性。 crossorigin
- 哪些没有通过标准CORS检查的正常
script
元素传递最少的信息到 {domxref('GlobalEventHandlers.onerror', 'window.onerror')}。可以使用本属性来使那些将静态资源放在另外一个域名的站点打印错误信息。参考 CORS 设置属性了解对有效参数的更具描述性的解释。 -
<script src="" crossorigin="anonymous"></script>
示例
<!-- HTML4 and (x)HTML --> <script type="text/javascript" src="javascript.js"> <!-- HTML5 --> <script src="javascript.js"></script>
规范
内容分类 |
---|
规范 | 状态 | 备注 |
---|---|---|
HTML Living Standard <script> |
Living Standard | Adds the module type |
HTML5 <script> |
Recommendation | |
HTML 4.01 Specification <script> |
Recommendation | |
Subresource Integrity <script> |
Recommendation | Adds the integrity attribute. |
浏览器兼容性
Feature | Chrome | Edge | Firefox (Gecko) | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|---|
Basic support | 1.0 | (Yes) | 1.0 (1.7 or earlier)[2] | (Yes) | (Yes) | (Yes) |
async attribute | (Yes)[1] | (Yes) | 3.6 (1.9.2)[1] | 10[1] | 15[1] | (Yes)[1] |
defer attribute | (Yes) | (Yes) | 3.5 (1.9.1)[6] |
4[3] |
未实现 | (Yes) |
crossorigin attribute | 30.0 | (Yes) | 13 (13) | 未实现 | 12.50 | (Yes)[4] |
integrity attribute | 45.0 | 未实现 | 43 (43) | 未实现[5] |
Feature | Android | Android Webview | Edge | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile | Chrome for Android |
---|---|---|---|---|---|---|---|---|
Basic support | (Yes) | (Yes) | (Yes) | 1.0 (1.0)[2] | (Yes) | (Yes) | (Yes) | (Yes) |
async attribute | (Yes)[1] | (Yes)[1] | (Yes) | 1.0 (1.0)[1] | 未实现[1] | ?[1] | (Yes)[1] | (Yes)[1] |
defer attribute | (Yes) | (Yes) | (Yes) | 1.0 (1.0) | 未实现 | ? | (Yes) | (Yes) |
integrity attribute | 未实现 | 45.0 | 未实现 | 43 (43) | 45.0 |
[1] 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.0 Firefox. In Firefox 4.0, the async
DOM property defaults to true
for script-created scripts, so the default behavior matches the behavior 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.0), set .async=false
on the scripts you want to maintain order. Never call document.write()
from an async
script. In Gecko 1.9.2, calling document.write()
has an unpredictable effect. In Gecko 2.0, calling document.write()
from an async
script has no effect (other than printing a warning to the error console).
[2] Starting in Gecko 2.0 (Firefox 4 / Thunderbird 3.3 / SeaMonkey 2.1), inserting script elements that have been created by calling document.createElement("script")
into the DOM no longer enforces execution in insertion order. This change lets Gecko properly abide by the HTML5 specification. To make script-inserted external scripts execute in their insertion order, set .async=false
on them.
Also, <script>
elements inside <iframe>
, <noembed>
and <noframes>
elements are now executed, for the same reasons.
[3] In versions prior to Internet Explorer 10 Trident implemented <script>
by a proprietary specification. Since version 10 it conforms to the W3C specification.
[4] The crossorigin
attribute was implemented in WebKit in WebKit bug 81438.
[5] WebKit bug 148363 tracks WebKit implementation of Subresource Integrity (which includes the integrity
attribute).
[6] 从 Gecko 1.9.2 (Firefox 3.6 / Thunderbird 3.1 / Fennec 1.0) 开始,在没有 src
属性的脚本标签上的 defer
属性会被忽略。但是在 Gecko 1.9.1 (Firefox 3.5 / Thunderbird 3.0 / SeaMonkey 2.0) 中,如果定义了 defer
属性,即使内嵌的脚本也会被延迟执行。