script要素
の仕様

script
スクリプト (Script statements)
種類
生テキスト要素
カテゴリ
レンダ
リング
ボックスを生成しない
非表示の要素
  1. script {
  2. display: none;
  3. }

CSS を大雑把に読むと、 要素とその子孫は、ボックスやテキストランを生成しません。 などになります。

使用できる状態
メタデータコンテンツを受け入れる要素。
フレージングコンテンツを受け入れる要素。
スクリプトをサポートする要素を受け入れる要素。
許可されている内容
src属性がない場合は、type属性に適合したスクリプトを与えるテキスト。
src属性がある場合は、空であるか、スクリプトのコンテンツ制限にも一致するスクリプトドキュメントのみを含む必要があります。
タグの省略
省略できません。
許可されているARIA
なし[No corresponding role]
属性

グローバル属性

src
リソースのアドレス
type
スクリプトの種類
nomodule
モジュールスクリプトをサポートするユーザーエージェントでの実行を防止します
async
フェッチ中にブロックせずに、可能な場合はスクリプトを実行します
defer
スクリプトの実行を延期する
crossorigin
要素がクロスオリジンリクエストを処理する方法
integrity
サブリソース整合性チェックで使用される整合性メタデータ[SRI]
referrerpolicy
要素によって開始されたフェッチのリファラーポリシー
blocking
要素が潜在的にレンダリングをブロックしているかどうか
DOM
HTMLScriptElement
  1. [Exposed=Window]
  2. interface HTMLScriptElement : HTMLElement {
  3. [HTMLConstructor] constructor();
  4.  
  5. [CEReactions] attribute USVString src;
  6. [CEReactions] attribute DOMString type;
  7. [CEReactions] attribute boolean noModule;
  8. [CEReactions] attribute boolean async;
  9. [CEReactions] attribute boolean defer;
  10. [CEReactions] attribute DOMString? crossOrigin;
  11. [CEReactions] attribute DOMString text;
  12. [CEReactions] attribute DOMString integrity;
  13. [CEReactions] attribute DOMString referrerPolicy;
  14. [SameObject, PutForwards=value] readonly attribute DOMTokenList blocking;
  15.  
  16. static boolean supports(DOMString type);
  17.  
  18. // also has obsolete members
  19. [CEReactions] attribute DOMString charset;
  20. [CEReactions] attribute DOMString event;
  21. [CEReactions] attribute DOMString htmlFor;
  22. };
PUG
_template.pug
  1. block variable
  2. block document
  3. doctype html
  4. html(lang="ja")
  5. head
  6. block head
  7. meta(charset="UTF-8")
  8. title 離珠のHTMLでしぃ！
  9. script(src="./risyu.js")
  10. | // ここにスクリプトのコメントが書けます。
  11. script
  12. | document.addEventListener("DOMContentLoaded", function() {
  13. | document.body.appendChild(document.createTextNode("スクリプトのさんぷる"))
  14. | });
  15. body
  16. block body
  17. | script要素のサンプル用ページです。
説明
script要素は、実行できるコードを表します。

script要素を使用すると、作成者はドキュメントに動的スクリプトとデータブロックを含めることができます。 この要素は、ユーザーのコンテンツを表すものではありません。

「script要素」のページで改めて詳細に記述しています。

  1. <!DOCTYPE html>
  2. <html lang="ja">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>離珠のHTMLでしぃ！</title>
  6. <script src="./risyu.js">
  7. // ここにスクリプトのコメントが書けます。
  8. </script>
  9. <script>
  10. document.addEventListener("DOMContentLoaded", function() {
  11. document.body.appendChild(document.createTextNode("スクリプトのさんぷる"))
  12. });
  13. </script>
  14. </head>
  15. <body>
  16. script要素のサンプル用ページです。
  17. </body>
  18. </html>
参照元
参照元
  1. HTML Living Standard. 4.12.1 The script element
  2. HTML Living Standard. 15 Rendering 15.3.1 Hidden elements
  3. HTML 5.2 W3C 勧告. 4.12.1. The script element (W3C勧告、2017年12月14日)
  4. HTML 5.2 W3C 勧告. 10.3.1. Hidden elements (W3C勧告、2017年12月14日)
  5. HTML 5.1 W3C 勧告. 4.12.1. The script element (W3C勧告、2016年11月1日)
  6. HTML 5.1 W3C 勧告. 10.3.1. Hidden elements (W3C勧告、2016年11月1日)
  7. HTML 4.01 Specification W3C 勧告. 18.2.1 The SCRIPT element (W3C勧告1999年12月24日)
  8. HTML 3.2 Reference Specification. STYLE and SCRIPT (W3C勧告1997年1月14日)
  9. MDN Web Docs. HTML <script>: スクリプト要素
  10. ECMAScriptR 2021 Language Specification
最終確認日
2022-07-27