HTML <script> タグ

定義と使用法

<script> タグを使用してクライアント側のスクリプトを埋め込みます。

<script> 要素はスクリプト文を含むか、または src 属性 外部スクリプトファイルを指す

最もよく使用されるスクリプトの種類は JavaScript ですが、ブラウザは他のスクリプト言語もサポートしています。

JavaScript の一般的な用途は画像処理、フォームのバリデーション、およびコンテンツの動的変更です。

注記：script 要素の種類はその使用法によって異なります。head 要素内に配置された script 要素はメタデータ要素に属しますが、他の要素（例えば body または section）のものは短語要素に該当します。

も参照してください：

HTML ガイド：HTML スクリプト

HTML DOM リファレンスマニュアル：スクリプト オブジェクト

JavaScript ガイド：JavaScript を学ぶ

例

例1：ドキュメント内に埋め込まれたスクリプトの定義

「Hello JavaScript!」をJavaScriptで書き込む：

<script>
document.getElementById("demo").innerHTML = "Hello JavaScript!";
</script>

自分で試してみてください

例2：外部スクリプトライブラリの読み込み

<script src="simple.js"></script>

自分で試してみてください

ヒントとコメント

ヒント：スクリプトが無効化されているか、スクリプトをサポートしていないブラウザに対して、以下も参照してください。 <noscript>要素。

ヒント：JavaScriptに関するさらに詳しい情報を学びたい場合は、私たちの JavaScript 教程。

属性

属性 値 説明
async async スクリプトを解析する際に並列でダウンロードし、利用可能になった場合にすぐに実行します（解析が完了する前に）（外部スクリプトのみに適用されます）。
crossorigin
  • anonymous
  • use-credentials
 リクエストのモードをHTTP CORSリクエストに設定します。
defer defer スクリプトを解析する際に並列でダウンロードし、ページの解析が完了した後に実行します（外部スクリプトのみに適用されます）。
integrity filehash ブラウザが取得したスクリプトを確認し、ソースコードが改ざんされた場合にコードが決して読み込まれないようにするために、ブラウザがチェックを行うことを許可します。
nomodule
  • True
  • False
 スクリプトがES2015モジュールをサポートするブラウザで実行されないように指定します。
referrerpolicy
  • no-referrer
  • no-referrer-when-downgrade
  • origin
  • origin-when-cross-origin
  • same-origin
  • strict-origin
  • strict-origin-when-cross-origin
  • unsafe-url
 スクリプトを取得する際に送信する参照者情報を指定します。
src URL 外部スクリプトファイルのURLを指定します。
type スクリプトタイプ スクリプトのメディアタイプを指定します。

HTMLとXHTMLの違い

XHTMLでは、スクリプト内の内容は#PCDATA（CDATAではなく）として宣言されており、これはエンティティが解析されることを意味します。

これは、XHTMLでは、すべての特殊文字がエンコードされるべきであるか、またはすべての内容がCDATA部分に括られるべきであることを意味します：

<script type="text/javascript">
//<![CDATA[
var i = 10;
if (i < 5) {
  // some code
}
//]]>
</script>

グローバル属性

<script> タグは以下のグローバル属性をサポートしています HTML のグローバル属性。

デフォルトの CSS 設定

ほとんどのブラウザは以下のデフォルト値を表示します <script> 要素：

script {
  display: none;
}

ブラウザのサポート

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
サポート サポート サポート サポート サポート