最終更新日
script要素は、ドキュメントに動的なスクリプトやデータブロックを含められるようにします。script要素はMetadataコンテンツまたはPhrasingコンテンツの記述箇所で使用できます。
動的なスクリプトを含める場合、スクリプトはscript要素内に記述するか、またはsrc属性を使って外部ファイルから読み込みます。スクリプトではなくデータブロックを含める場合、データはscript要素内に記述しなければなりません。データ形式は、type属性を使って指定できます。この場合、src属性の指定は不可です。
type属性は、スクリプトの記述言語またはデータ形式を、MIMEタイプで指定します。type属性の指定を省略した場合の既定値は「text/javascript」で、それ以外の場合には、type属性の指定が必須です。
src属性では、使用する外部スクリプトファイルのURLを指定します。src属性を指定した場合は、charset属性、async属性、defer属性も指定できます。
charset属性は、外部スクリプトファイルの文字コードを指定します。
async属性とdefer属性では、スクリプトの実行タイミングについて指定できます。async属性を指定すると、スクリプトは利用可能になった時点で非同期に実行されます。defer属性だけを指定すると、スクリプトはページの表示が完了したあとで実行されます。どちらの属性も指定していない場合、スクリプトは即座に取り込まれ実行されて、ページの表示がそれに続きます。async属性とdefer属性の両方を指定すると、async属性をサポートしていないブラウザではdefer属性のタイミングで実行されます。
なお、charset属性、async属性、defer属性は、src属性を指定した場合のみ使用できます。
カテゴリ | タグの省略 | 親要素 | 子要素 |
---|---|---|---|
Metadataコンテンツ Flowコンテンツ Phrasingコンテンツ |
省略不可 | head、Phrasingコンテンツを子にできる要素 |
src属性なし:type属性の値による src属性あり:スクリプトの説明 |
属性 | 値 | 説明 |
---|---|---|
src | URL | 外部スクリプトファイルのURLを、相対または絶対パスで指定します。 |
async | async | 論理属性。指定した場合、スクリプトは利用可能になった時点で非同期に実行されます。 |
defer | defer | 論理属性。指定した場合、スクリプトはページの表示が完了したあとで実行されます。 |
type | MIMEタイプ | スクリプトのメディアタイプを指定。JavaScriptの場合は「text/javascript」です。 |
charset | 文字コード | 外部スクリプトファイルの文字コードを指定します。 |
グローバル属性 | - | - |
イベント属性 | - | - |
<!DOCTYPE html> <html lang="ja"> <head> <title>マクドエイド</title> <script type="text/javascript" src="sample.js" charset="utf-8"></script> </head> <body> <p>バーガーショップ「マクドエイド」にようこそ!</p> <script type="text/javascript"> document.write("マクドエイド表参道店がオープンしました!"); </script> </body> </html>