script要素

要素名	バージョン	開始タグ	終了タグ	分類/親	中身
script	4.0, X1.0, X1.1	必須	必須	body, blockquote, form, %head.misc;, %special;	CDATA

属性名	バージョン	属性値	既定値	備考
type	4.0, X1.0, X1.1	%ContentType;	#REQUIRED	content type of script language
src	4.0, X1.0, X1.1	%URI;	#IMPLIED	URI for an external script
charset	4.0, X1.0, X1.1	%Charset;	#IMPLIED	char encoding of linked resource
defer	4.0, X1.0	(defer)	#IMPLIED	UA may defer execution of script
language	(4.0), (X1.0)	%Text;	#IMPLIED	predefined script language name
event		CDATA	#IMPLIED	reserved for possible future use
for		CDATA	#IMPLIED	reserved for possible future use

scriptの解説

JavaScript などのスクリプト言語を記述します。script要素内にスクリプトを直接記述することもできますし、src属性を指定して外部のファイルから読み込むこともできます。

いずれの場合も type属性が必須です。type="text/javascript" のように言語の MIME タイプを指定します。language="JavaScript" がお馴染みかも知れませんが、こちらの方法は非推奨となっています。言語名の標準規格ができていないことなどが理由です。

defer属性を指定すると、スクリプトの実行を後回しにします。たとえば、

<head>
<script type="text/javascript">
function func(){
……うんざりするほど長大な関数定義……
}
</script>
</head>
<body>
<p>長々とした文章……</p>
<button onclick="func()">

などという構造になっていたとき、読み込む端から JavaScript を解釈していたのでは文書の表示が後回しになってしまいます。そんなとき、defer属性を指定しておくと、先に文書を表示しておき、ユーザーがそれを読んでいる間にスクリプトの関数定義を解釈することができます。ただし、defer属性を指定したスクリプトの中で document.write のように文書そのものを書き換える文を実行することはできません。おそらくスクリプトエラーになることでしょう。

HTML4 では、この要素の中身は CDATA です。 を書いてもその中は無視されませんし、& を書いてもそのままの形で解釈されます。唯一SGML 的に扱われるのは終了タグ開始区切り子 </ で、これは SCRIPT 要素の終了タグと解釈されます (SCRIPT の終了タグは </SCRIPT> とは限らないことに注意。短縮タグ機構に従って </> と略記されているかも知れません)。

言うまでもありませんが、スクリプトが実行できない環境や、スクリプトを無効にしているユーザが存在します。スクリプト無効環境で代替内容を出したい場合には、noscript要素を使うことができます。

余談ですが、この要素の登場は意外に遅く、HTML4 で初登場です。それまではブラウザ独自拡張としての運用でした。ただし HTML3.2 では script という名前の予約だけがされていて、これを勘違いしたのか、HTML3.2 から script要素があったかのような解説をしている本もありました。

XHTMLでの注意

XMLでは要素の内容モデルをCDATAとすることができないため、XHTMLでは、script要素の内容モデルも#PCDATAとなっています。そのため、「<」などをそのまま書くとマークとして認知されてしまいます。

それを回避するためにはCDATA区間を使用すれば良いのですが、ブラウザがXHTMLを理解せずにHTMLとしてパースした場合、マーク区間の開始・終了の区切り子がそのままスクリプトエンジンに渡ってエラーとなってしまいます。互換性を考えると、こんなふうにする必要があります。

ただし、CDATA区間では「]]>」という文字列がマークとして認知されてしまいます。これをエスケープする方法は存在しませんので、「<」も「]]>」も出現する可能性がある場合には非常に面倒なことになります。

「<」が含まれていない事が確実であれば、CDATA区間なしにそのまま書いてしまっても良いでしょう。ただし、前述の通り、#PCDATAではコメントを認知することに注意する必要があります。

また、script要素を知らない古いブラウザのために、script要素の中身を  で括るということがよく行われますが、#PCDATAではそれが本当にコメントとみなされ、スクリプトエンジンに渡されなくなるかもしれません。

※個人的には、もはや script要素の中身を  で括る必要はないと思っていますが……。

何かと面倒ですので、XHTMLではscript要素の中身にスクリプトを直接記述することは避け、外部ファイルをsrc属性で参照するようにした方が賢明かもしれません。

「script要素」へのコメント (8件)