表題通り、『XHTML では「/>」で閉じるタグ』で、『HTML5 では「>」で閉じるタグ』の一覧を（今さらながら）メモしておく。
なぜこのページを作成したか
当初、何も考えず『「/>」で閉じるタグは全部 一括して「>」に置換すればOKでしょ(楽勝)』などと考えてしまった。下調べをせず、いきなり一括置換を実行したら、「svg ファイルは HTML5 でも「/>」で閉じなきゃダメ」、という事で、とあるサイトで SVGファイルを全滅させてしまった。
日曜日は利用者ゼロのクローズトなサイトであり、かつ10～15分ほどで復旧できたから良いものの、やっぱ下調べは大切だなあ。と大反省をするに至った次第。という事で、記録を残しておくことにした。
まえおき おわり。以下、本文。
XHTML で「/>」で閉じる主なタグ一覧
まず、XHTML では「/>」で閉じるタグで、HTML5において 末尾のスラッシュ（/）を削除しても良い「空要素 (Void Elements)」の全リストを示す。
現在の標準仕様では以下の 14種類 である。
- 仕様で定められたもの
<area />: イメージマップの領域
<base />: 文書のベースURL
<br />: 改行
<col />: テーブルの列の属性
<embed />:
<hr />: 水平線
<img />: 画像の埋め込み
<input />: フォームの入力項目
<link />: 外部リソースへのリンク（スタイルシートなど）
<meta />: メタデータ（文字コード、キーワードなど）
<param />: オブジェクトのパラメータ - 以下は HTML5で追加されたタグだが、XHTML で使用する際は />で閉じるもの
<embed />: （、外部アプリケーション・コンテンツ）
<source />: （HTML5で追加、メディアリソース（<video>や<audio>内））
<track/ >: （HTML5で追加、メディアのテキストトラック）
<wbr />: （HTML5で追加、改行可能箇所の指定 ）
上記と同じものを、逆の視点から書くと以下になる。
HTML5でスラッシュを消して良いタグ一覧
- <area>
<base>
<br>
<col>
<embed> （HTML5で追加、外部アプリケーション・コンテンツ）
<hr>
<img>
<input>
<link>
<meta>
<param>
<source> （HTML5で追加、メディアリソース（<video>や<audio>内））
<track> （HTML5で追加、メディアのテキストトラック）
<wbr> （HTML5で追加、改行可能箇所の指定 ）
メインの情報はここまで。
以下、上記情報の元としたリンクや、一括置換したい場合のコード等を残しておく。
仕様を確認してみる
ここには、リンク紹介と、簡単なメモ書きのみ残す。
- There are only 10 legal XHTML empty tags - Justinsomnia
- 上記が XHTMLで仕様となっている空タグである。ぜんぶで10個。
- 上記の10個に、現在では <embed> <source> <track> <wbr> が追加されている（HTML5で追加）
- その他参考リンク
Void (empty) elements and self-closing start tags in HTML | 456 Berea Street
重要: 一括置換したい場合のメモ
- 一括置換時の注意点
SVG や MathML: HTMLファイル内に <svg> や <math> を埋め込んでいる場合、その中にあるタグ（<circle />など）は XMLのルールに従う ため、スラッシュを残す必要がある。これらを除外して置換するよう注意する。 - 置換に正規表現を使う場合
面倒なので AI にお願いした。
※ なんか上手く動かない予感がしたので自分では試していない。使う場合は自己責任で。
- (<(area|base|br|col|embed|hr|img|input|link|meta|param|source|track|wbr)[^>]*?)\s?/>
を使って
$1>
に置換する
- (<(area|base|br|col|embed|hr|img|input|link|meta|param|source|track|wbr)[^>]*?)\s?/>
このページの情報は以上。