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
type = ContentType
src = URI
defer = "defer"
xml:space = preserve

サンプル

<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 要素が実行できない場合に限り、解析・描画されます。


Copyright © 2001, SUGAI, Manabu. All rights reserved. 著作権は放棄していません。
SEO [PR] ”š‘¬!–³—¿ƒuƒƒO –³—¿ƒz[ƒ€ƒy[ƒWŠJÝ –³—¿ƒ‰ƒCƒu•ú‘—