scriptタグをって書くと、なんで上手くいかないかまとめてみた

これは何？

HTMLにて以下のようにscriptタグを書いた所、それ以降のscriptが正常に認識されませんでした
(Firefox3.0, IE7にて再現。Google Chromeでは何故か正しく動作)

<script type="text/javascript" src="〜.js" />
<script type="text/javascript">
	"ここのコードが読み込まれなかった！"
</script>

んで、原因を色々調べたところ、HTML4.1ではこういう書き方だと、閉じタグが無いものと認識されることが判明

以降、なんでそれがダメかをまとめます

正しくは、こう書く
<script type="text/javascript" src="〜.js"></script>
<script type="text/javascript">
	"ここのコードが読み込まれなかった！"
</script>

注意点

2009/06/16時点でのXHTML1.1, HTML4.01を基準に話を進めてます

以降のバージョンが標準になった場合、話が変わる可能性があるので注意してください

なんで？ とか書いてもOKじゃない？

2つ勘違いをしてます

- という書き方は、XHTMLの書き方で、HTMLの書き方ではない

- br は空要素だが、script は空要素ではない

空要素

<img> や のように内容を持たない要素の事を空要素といいます

んで、空要素については、 のような書き方が、HTML, XHTML 共々許されていますが(後述)、

<script src""〜.js"> のような、内容を持ちうるが、今回は中身が空である要素については、きちんと終了タグを書かないといけません

どの要素型宣言も、概して、3つの部分を記す。開始タグ、内容、終了タグ、である。 
		
〜 中略 〜
		
HTML要素型の中には、著者が終了タグを省略することを許容するものもある。(例えば、P要素型やLI要素型)。

On SGML and HTML (ja) - 3.2.1 要素

終了タグの有無(空要素であるかどうか)については、各要素のリファレンスに書かれているのでそちらを参照

Index of the HTML 4 Elements

XHTMLとHTMLの違い

XHTML

XHTMLっていうのは、HTML の文法を元ネタである XML の文法にあわせて、XMLパーサでも読めるようにして、汎用性を上げようって考えの元作られているようです

んで、XML の文法として、全てのタグは閉じないといけないので、brタグとかは以下のような記述となります

<br></br>
<img src="01.jpg"></img>

但し、それだと今まで HTML 書いてた人には違和感がある為、空要素については、以下のような書き方も許容しています

<br/>
<img src="01.jpg"/>

詳しくはこの辺参照

(最新は1.1なのだけど、w3cの1.1で言及してるところが見つからなかったので、こちらで我慢)

XHTML 1.0: 拡張可能ハイパーテキストマークアップ言語 4. HTML4との相違点

なので、 という書き方は XHTML の文法ってことはOKでしょうか

HTML

んで、HTML だと、空要素タグに閉じタグをつけることは許されません

HTMLの要素型には、内容が存在しないものもある。例えばline breakの要素 BRには内容がない。その唯一の役割は、テキストに含まれる1つの行の終端を示すことである。このような 空要素は、終了タグを絶対に持たない。

On SGML and HTML (ja) - 3.2.1 要素

こういう書き方はNG!
大半のブラウザでは、<br>が2個あると判断される
<br></br>
<img src="01.jpg"></img>

但し、 という書き方は / の前にスペースをつければ、HTML でも、XHTMLでも正しく認識される旨が、書かれています

たとえば <br /> や <hr />, <img src="karen.jpg" alt="Karen" /> といったように、空要素の末尾の / と > との前にスペースを1個組み込むこと。また、たとえば <br /> といったように、空要素には最小化タグ文法を使うこと。これは、XMLで許容されている代わりの文法 <br></br> は、多くの既存のユーザエージェントでは与えられる結果が一定しないからである。

XHTML 1.0: 拡張可能ハイパーテキストマークアップ言語 - 付録C. HTML互換性ガイドライン

これなら、XHTML、HTML両方でOK
<br />
<img src="01.jpg" />

おまけ

現状、ブラウザにXHTMLを認識させるには、ヘッダでの宣言以外に、拡張子を.hxtmlにした方がベターかも

参考リンク

- XHTML 1.0: 拡張可能ハイパーテキストマークアップ言語

- HTML 4.01 Specification (ja)

- XML空要素タグのHTML的解釈・付記 - 徒書

そんなかんじー