`script` 要素

since: 31st/Aug./2001; last modified: 28th/Sep./2001

script 要素タイプはスクリプティングモジュールに含まれる要素で、 head 要素の子要素と body 要素の子孫要素して定義されています。

script 要素タイプの役割は、スクリプト情報を記述することです。ユーザエージェントは、スクリプトの種類に応じてスクリプトエンジンに受け渡し、返ってきた結果を出力します。

noscript, script

要素	属性	最小内容モデル
`noscript`	`Common`	`(Heading \| List \| Block)+`
`script`	`charset` (Charset), `defer` ("`defer`"), `src` (URI), `type`* (ContentType), `xml:space="preserve"`	PCDATA

このモジュールが使われるときは、テキスト・モジュールの内容セット Block と Inline に、 script 要素と noscript 要素が追加される。加えて、構造モジュールで定義される head 要素の内容モデルに script 要素が追加される。

実装： DTD

内容モデル

script 要素の内容は、解析対象となる文字データ (Processed Character DATA) です。単なる文字データ (CDATA) ではないので、マークアップ区切り文字は意味を持ち、文字実体参照などは展開されます：

<script type="text/javascript">
document.write('Hello, World!');
</srcipt>

CDATA セクション

CDATA にする為には CDATA セクションを利用するべきです：

<script type="text/javascript">
//<![CDATA[
document.write('<img src="../../nextindexb.jpg" alt="NEXTindexバナ－" />');
//]]>
</script>

HTML 4 では、スクリプトをサポートしていないブラウザで、スクリプトがテキストのまま表示されてしまうのを避けるために、コメントアウトするように推奨されていました：

<script type="text/javascript">
<!--
document.write('<img src="../../nextindexb.jpg" alt="NEXTindexバナ－" />');
//-->
</script>

HTML 4 では script 要素の内容が CDATA だったので、 "<!--" は解析されず、コメント区切りとしての意味を持てません。逆に、 style 要素をサポートしていないユーザエージェントは、内容を通常の PCDATA と解釈してしまうので、コメントが有効になり、内容が無視されるのです。

しかし、 XHTML では script 要素の内容も PCDATA になったので、 "<!--" はコメント開始のマークアップ区切りとして解釈されてしまいます。そして、 XML では、コメント内部は完全に無視され得ます。したがって、スタイル情報も意味を失い、働かない可能性があります。

内容が PCDATA に定義されている時点で、後方互換としてのコメントアウトは利用できなくなりました。必要な場合は、外部スクリプトを使いましょう。

「CDATA と PCDATA」と「コメント」に関しては、本稿付録「コメントと CDATA セクション」を参照ください。

属性

charset

src 属性で参照されているスクリプトファイルの文字符号化方法を指定する。
当該 script 要素とは無関係

type = ContentType

必須属性
当該スクリプトの種類を指定。
JavaScript ならば type="text/javascript"

src = URI

外部スクリプトファイルの URI。
参照目的地のスクリプトが当該要素内に記述されているのと同じ。

defer = "defer"

当該スクリプトが、文書の本文を生じないことを明示する。
これを指定すれば、ユーザエージェントは、スクリプトエンジンの応答を待たずに、後続内容の解析・描画を進められる。

xml:space = preserve

値は preserve に固定されている。
一般に XML 文書では、空白を保持して欲しい要素には xml:space="preserve" を与えます。反対に、ユーザーエージェントの初期値に任せる場合は、 xml:space="default" を指定します。

サンプル

<script type="text/javascript">
//<![CDATA[
var today = new Date();
var hour = today.getHours();
document.write("今は");
if (hour < 12) {
	document.write("午前中");
} else {
	document.write("午後");
}
document.write("です");
//]]>
</script>

`noscript` 要素との併用

当該スクリプトをユーザエージェント（が渡すスクリプトエンジン）がサポートしていれば問題ありませんが、そうでない場合は可読性を損なう恐れがあります。このような場合に備えて、スクリプトは外部スクリプトファイルで提供し、 noscript 要素を利用するように推奨します。

外部スクリプトファイルの利用

<script type="text/javascript"
        src="scriptsample.js"
        charset="UTF-8"></script>

[scriptsample.js]

これで、当該スクリプトをサポートしていないユーザエージェントからは、スクリプトソースが完全に隠れました。スクリプトソースが露出することはありえません。

charset 属性は目標外部スクリプトファイルの文字符号化法を指定します。 MS I.E. では当該文書の文字コードに自動的に変換されて出力されますが、 Netscape 6.1 ではそのような仕組みはなく、読み込みつづけたままになってしまいます。外部スクリプトファイルと参照もとの文書の文字符号化法は一致させておく方が無難です。

`noscript` 要素の利用

スクリプトが実行されないと、ナビゲーション出来ない場合にだけ出力する内容を、 noscript 要素で提供します。

<body>
<script type="text/tcl">
  ..."data.dat" の内容へのナビゲーションが
  含まれているとします。...
</script>
<noscript>
<p><a href="./data.dat">DATA</a>を参照ください。</p>
</noscript>
</body>

noscript 要素の内容はブロックレベルの要素です。要素の階層関係に注意して、ブロックレベルとテキストレベルが逆転しないように注意してください。

noscript 要素の内容は、直前の script 要素が実行できない場合に限り、解析・描画されます。

script 要素