Loose-Info.com

Last Update 2019/12/25


TOP - HTML(HyperText Markup Language) - <SCRIPT>

・タグの機能
タグの間に記述された内容は、スクリプトのコードと解釈されます。


・構成
内容モデル宣言概要
宣言内容 : CDATA(スクリプトのコード)

タグの省略
開始 → 不可
終了 → 不可

DTD(注1)での記述

SCRIPT要素宣言
<!ELEMENT SCRIPT - - %Script; -- script statements -->

Script(引数実体参照) の実体宣言
<!ENTITY % Script "CDATA" -- script expression -->


・属性
charset
属性機能 : スクリプトをエンコードする際に使用した文字セット
省略時値 : IMPLIED

type
属性機能 : スクリプト言語の種類を指定
省略時値 : REQUIRED

解説
スクリプトの種類がJavaScriptの場合、
type="text/javascript"
と指定します。

src
属性機能 : スクリプトのコードが別ファイルの場合、そのURLを指定
省略時値 : IMPLIED

defer
属性機能 : スクリプトの実行をドキュメントの表示完了後に遅延
省略時値 : IMPLIED

解説
この属性は、属性名及びviを省略して記述します。(属性の指定)

event
属性機能 : 将来利用時の予約用
省略時値 : IMPLIED

for
属性機能 : 将来利用時の予約用
省略時値 : IMPLIED

DTD(注1)での記述

SCRIPT要素の属性定義
<!ATTLIST SCRIPT charset %Charset; #IMPLIED -- char encoding of linked resource -- type %ContentType; #REQUIRED -- content type of script language -- src %URI; #IMPLIED -- URI for an external script -- defer (defer) #IMPLIED -- UA may defer execution of script -- event CDATA #IMPLIED -- reserved for possible future use -- for %URI; #IMPLIED -- reserved for possible future use -- >

Charset(引数実体参照) の実体宣言
<!ENTITY % Charset "CDATA" -- a character encoding, as per [RFC2045] -->

ContentType(引数実体参照) の実体宣言
<!ENTITY % ContentType "CDATA" -- media type, as per [RFC2045] -->

URI(引数実体参照) の実体宣言
<!ENTITY % URI "CDATA" -- a Uniform Resource Identifier, see [URI] -->



・サンプルコード(1)
HTMLドキュメント内にJavaScriptのコードがある場合
<HTML> <HEAD> <META http-equiv="Content-Type" content="text/html; charset=UTF-8"> <TITLE>テスト</TITLE> <SCRIPT type="text/javascript"> <!-- function btnclick() { alert("テスト"); } //--> </SCRIPT> </HEAD> <BODY> <INPUT type="button" name="button1" value="テスト" onClick="btnclick()"> </BODY> </HTML>

・サンプルコード(2)
別ファイルにJavaScriptのコードがある場合

test.html
<HTML> <HEAD> <META http-equiv="Content-Type" content="text/html; charset=UTF-8"> <TITLE>テスト</TITLE> <SCRIPT type="text/javascript" src="test.js"> </SCRIPT> </HEAD> <BODY> <INPUT type="button" name="button1" value="テスト" onClick="btnclick()"> </BODY> </HTML>
test.js
function btnclick() { alert("テスト"); }


注1)
DTD関連の記述はhttp://www.w3.org/TR/1999/REC-html401-19991224/strict.dtd より引用しています(着色部)。
上記のDTDが最新のものとは限りません。
最新版はhttp://www.w3.org/TR/html4/strict.dtdを確認してください。