HTMLのscriptタグについて
scriptタグの定義と使用説明
HTMLのscriptタグは、ウェブページにJavaScriptコードを埋め込むために使用されます。JavaScriptは、ウェブページの動的な動作を制御するためのプログラミング言語で、ユーザーのアクションに応じてページの内容を変更したり、アニメーションを追加したりするために使用されます。scriptタグはヘッド部分やボディ部分のどちらにも配置することができます。
ブラウザの対応度
scriptタグは、すべての最新の主要なウェブブラウザでサポートされています。これは、HTMLの基本的な機能であり、クロスブラウザ対応が基本となっています。
| ブラウザ | 対応バージョン |
|---|---|
| Google Chrome | 全バージョン |
| Mozilla Firefox | 全バージョン |
| Microsoft Edge | 全バージョン |
| Safari | 全バージョン |
| Opera | 全バージョン |
scriptタグの属性とイベント
scriptタグには以下のようないくつかの属性があります。
| 属性 | 説明 |
|---|---|
| src | 外部JavaScriptファイルのURLを指定します。 |
| type | スクリプトのMIMEタイプを指定します。デフォルトは"text/javascript"です。 |
| async | スクリプトの非同期実行を指定します。 |
| defer | ページの解析が終わるまでスクリプトの実行を遅延させます。 |
また、scriptタグに関連するイベントとして以下のものがあります。
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>
簡単なJavaScript例
</title>
<script type="text/javascript">
function msg(){ alert("こんにちは、世界！"); }
</script>
</head>
<body>
<button onclick="msg()">クリックしてメッセージを表示</button>
</body>
</html>QA
Q1: scriptタグはどこに配置するのが良いですか？
A1: scriptタグは、ページのヘッド部分やボディ部分の最後に配置するのが一般的です。ヘッド部分に配置すると、ページが読み込まれる前にスクリプトが実行されますが、ボディ部分の最後に配置すると、ページの内容がすべて読み込まれた後にスクリプトが実行されます。
Q2: 外部JavaScriptファイルを読み込むための属性は何ですか？
A2: 外部JavaScriptファイルを読み込むためには、scriptタグのsrc属性を使用します。
Q3: async属性とdefer属性の違いは何ですか？
A3: async属性はスクリプトを非同期に実行するのに対して、defer属性はHTML文書の解析が完了した後にスクリプトを遅延実行します。