HTML <script> 要素は実行可能なスクリプトを埋め込み、または外部参照するコードを指定する際に用いられます。

コンテンツカテゴリー メタデータコンテンツフローコンテンツフレージングコンテンツ
許可された内容 text/javascript などの動的スクリプト
タグの省略 不可。開始と終了タグの両方が必要。
許可された親要素 メタデータコンテンツ を受け入れるすべての要素、または フレージングコンテンツ を受け入れるすべての要素
許可された ARIA ロール なし
DOM インターフェイス HTMLScriptElement

属性

他のすべての要素と同様に、この要素はグローバル属性を持ちます。

async HTML5

この論理属性は、可能であればブラウザーはスクリプトを非同期的に実行すべきであることを示します。この属性は、src 属性がない場合 (すなわちインラインスクリプト) に使用してはいけません。そのようなケースに該当するとき、この属性は効果がありません。

動的に挿入されたスクリプトはデフォルトで非同期実行されますので、同期実行する (すなわち、読み込まれた順に実行するスクリプト) には `async=false` を設定します。

ブラウザーのサポート状況については Browser compatibility をご覧ください。asm.js 向け非同期スクリプト もご覧ください。

crossorigin
通常の script 要素は標準の CORS チェックをパスしないスクリプトに対して、window.onerror に最小限の情報しか渡しません。静的なメディアに別のドメインを使用するサイトに対してエラーロギングを許可するため、この属性を使用してください。有効な値について、詳しくは CORS 設定属性 をご覧ください。
defer
この論理属性は、スクリプトを文書のパース完了後かつ DOMContentLoaded が発生する前に実行することをブラウザーに示します。この属性は、src 属性がない場合 (すなわちインラインスクリプト) に使用してはいけません。そのような場合は効果がありません。動的に挿入されたスクリプトで同様の効果を得るには、代わりに `async=false` を使用します。
integrity
この属性は、取得したリソースが予期せぬ改ざんを受けずに提供されたかを、ユーザーエージェントが検証するために使用できるメタデータを含みます。Subresource Integrity をご覧ください。
nomodule
この論理属性は、ES6 modules をサポートするブラウザーでスクリプトを実行するべきではないことを示します。要するに、モジュール式の JavaScript コードをサポートしない古いブラウザー向けのフォールバックスクリプトを提供するために使用できます。
src
この属性は外部スクリプトの URI を指定します。直接文書にスクリプトコードを埋め込む代わりに外部参照を行うスクリプトファイルを指定します。src 属性が指定されている script 要素は、自身のタグ中に埋め込みスクリプトを持つべきではありません。
text
textContent 属性と同じように、この属性は要素のテキストコンテンツを設定します。textContent 属性との違いは、ノードが DOM に挿入された後に実行可能なコードとして評価されることです。
type

スクリプトを表すタイプを指定します。この属性の値は、以下の種類のいずれかにします:

  • 省略または JavaScript の MIME タイプ: HTML5 に準拠するブラウザーで、これはスクリプトが JavaScript であることを示します。HTML5 仕様では作者に対して、冗長な MIME タイプを指定せずに属性を省略するよう主張しています。過去のブラウザーでは埋め込まれている、あるいは (src 属性で) インポートされたコードのスクリプト言語を指定していました。JavaScript の MIME タイプは 仕様書に掲載されています
  • module: HTML5 HTML5 に準拠するブラウザーは、コードを JavaScript モジュールとして扱います。スクリプトの処理は、charset および defer 属性の影響を受けません。module の仕様に関する情報について、ES6 in Depth: Modules をご覧ください。
  • 上記以外の MIME タイプ: このタグで埋め込んだコンテンツを、ブラウザーによって処理されないデータブロックとして扱います。src 属性は無視します。

Firefox では type=application/javascript;version=1.8 を指定すると、let 分など新しい JS バージョンの高度な機能を使用できます 。ただしこれは非標準の機能ですので、特に Chromium ベースのブラウザーなど他のブラウザーではサポートされていません。

他のプログラミング言語を含める方法については Rosetta をご覧ください。

非推奨属性

language
type 属性と同じように、この属性は使われているスクリプト言語を指定する際に用いられます。type 属性と異なるのは、この属性に指定可能な値が標準化されることがなかったという点です。そのため、通常はこの属性の代わりに type 属性を用いるべきです。

注記

async 属性または defer 属性を持たない script はインラインスクリプト同様に、ブラウザーがページの解析を続けるより先に、ただちに読み込みおよび実行されます。

スクリプトは text/javascript MIME タイプで提供するべきですが、ブラウザーは寛大であり、画像 (image/*)・動画 (video/*)・音声 (audio/*)・text/csv のタイプで提供されたスクリプトに限りブロックします。スクリプトがブロックされると、load イベントではなく error イベントが発生します。

<!-- HTML4 および (x)HTML -->
<script type="text/javascript" src="javascript.js"></script>

<!-- HTML5 -->
<script src="javascript.js"></script>

仕様

仕様書 策定状況 コメント
HTML Living Standard
<script> の定義
現行の標準 module タイプを追加
HTML5
<script> の定義
勧告  
HTML 4.01 Specification
<script> の定義
勧告  
Subresource Integrity
<script> の定義
勧告 integrity 属性を追加

ブラウザー実装状況

機能ChromeEdgeFirefoxInternet ExplorerOperaSafari
基本サポート1 (有り)11 (有り) (有り) (有り)
async1 (有り)1 (有り) (有り) (有り)
crossorigin30 (有り)13 無し12 (有り)2
defer (有り) (有り)3.53104 無し (有り)
integrity45 無し43 無し ? 無し5
language1 (有り)1 (有り) (有り) (有り)
module 無し 無し 無し 無し 無し (有り)
nomodule (有り) 無し (有り)6 無し 無し 無し
src1 (有り)1 (有り) (有り) (有り)
text1 (有り)1 (有り) (有り) (有り)
type1 (有り)1 (有り) (有り) (有り)
機能AndroidChrome for AndroidEdge mobileFirefox for AndroidIE mobileOpera AndroidiOS Safari
基本サポート (有り) (有り) (有り)4 (有り) (有り) (有り)
async (有り) (有り) (有り)4 (有り) (有り) (有り)
crossorigin (有り) (有り) ?14 無し ? ?
defer (有り) (有り) (有り)4 無し ? (有り)
integrity4545 無し43 無し ? 無し
language (有り) (有り) (有り)4 (有り) (有り) (有り)
module 無し 無し 無し 無し 無し 無し (有り)
nomodule (有り) (有り) 無し (有り)6 無し ? 無し
src (有り) (有り) (有り)4 (有り) (有り) (有り)
text (有り) (有り) (有り)4 (有り) (有り) (有り)
type (有り) (有り) (有り)4 (有り) (有り) (有り)

1. Starting in Firefox 4, inserting <script> elements that have been created by calling document.createElement("script") no longer enforces execution in insertion order. This change lets Firefox properly abide by the specification. To make script-inserted external scripts execute in their insertion order, set .async=false on them.

2. The crossorigin attribute was implemented in WebKit in WebKit bug 81438.

3. Since Firefox 3.6, the defer attribute is ignored on scripts that don't have the src attribute. However, in Firefox 3.5 even inline scripts are deferred if the defer attribute is set.

4. In versions prior to Internet Explorer 10, it implemented >script< by a proprietary specification. Since version 10 it conforms to the W3C specification.

5. WebKit bug 148363 tracks WebKit implementation of Subresource Integrity (which includes the integrity attribute).

6. This feature is behind the dom.moduleScripts.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.

互換性情報

async 属性をサポートしない古いブラウザーでは、パーサーによって挿入された script はパーサーを妨害します。スクリプトによって挿入された script は、IE および WebKit では非同期的に、Opera およびバージョン 4 より前の Firefox では同期的に実行します。Firefox 4 ではスクリプトが生成した script で async DOM プロパティの既定値が true であるため、デフォルトの動作が IE や WebKit の動作に一致します。スクリプトによって挿入された外部スクリプトをブラウザーで挿入順に実行することを要求するには、document.createElement("script").asynctrue と評価される場合 (Firefox 4 など) に、順序を制御したい script で .async=false を設定します。非同期スクリプトから document.write() を呼び出してはいけません。Firefox 3.6 では document.write() を呼び出すと予期せぬ効果をもたらします。Firefox 4 では async スクリプトから document.write() を呼び出しても効果がありません (エラーコンソールに警告を出力することを除く)。

関連情報

ドキュメントのタグと貢献者

 このページの貢献者: yyss, ethertank, RobinEgg
 最終更新者: yyss,