カラクリ.jp

HTML における id 属性のまとめ 4.x~ と 5.x~ の違い

投稿日
HTML のイメージ。

HTML4.01 および HTML5.0 における id 属性の仕様についてまとめています。 結論から示すと、id 属性には概ね次のようなことが言えます。

  • HTML4.01 では、半角英数字と一部の記号しか使えず、半角英字から開始する必要があった。
  • HTML5.0 では、スペース文字(空白文字)の禁止を除く、あらゆる制限がなくなった。
    • スペース文字とは、スペース・タブ・改行・改ページ、を指す。
    • 極端に言えば、全角日本語を id に指定することができるようになった。
  • 互換を維持したいときは、HTML4.01 の仕様に合わせるしかない。

HTML4.01 での仕様

HTML4.1 では、id 属性に与える値は厳しく制限されています。制限の内容は次の通りです。

  • HTML4.01 で id 属性に与える値の制限
    • 使える文字は以下に限定される。
      • 半角英数字(a-z|A-Z|0-9)、ハイフン(-)、アンダースコア(_)、コロン(:)、ピリオド(.)
      • 値の最初の文字は半角英字(a-z|A-Z)であること。

HTML4.01 ～ HTML5.0 の普及の間には XHTML1.0 または XHTML1.1 の普及があります。HTML4.01 と XHTML1.x とでは、属性などに関する仕様が若干ながら異なりますので、仕様の確認などの際には注意が必要です。

Reference
W3C原文

HTML5 での仕様変更

id 属性はそもそも特定の文字列しか使えなかったのですが、HTML5 では変更されているようです。W3C 公式のドキュメントを簡単に翻訳します。

The id attribute specifies its element's unique identifier (ID). [DOM]

id 属性はその要素を一意に識別するための ID を指定します。

The value must be unique amongst all the IDs in the element's home subtree and must contain at least one character. The value must not contain any space characters.

値はホームサブツリー(その要素が含まれるHTMLドキュメント)の要素で一意である必要があり、 さらに少なくとも1つの文字を含める必要があります。値はあらゆるスペース文字を含めてはいけません。

There are no other restrictions on what form an ID can take; in particular, IDs can consist of just digits, start with a digit, start with an underscore, consist of just punctuation, etc.

それ以外に、ID に求められる制限はありません。特に、ID は数字(のみ)から構成することができ、 数字から開始することができ、アンダースコア(_)から開始することができ、句読点(のみ)から構成することができます。 (補足 : HTML4.x ～ などではできなかったため、"特に" と記されていると思われる。)

An element's unique identifier can be used for a variety of purposes, most notably as a way to link to specific parts of a document using fragment identifiers, as a way to target an element when scripting, and as a way to style a specific element from CSS.

要素の一意に定まる識別子(ID)は様々な目的のために使用することができ、最も顕著な例としては ID をフラグにしてドキュメントのある特定の部分へのリンクとして使用したり、 スクリプトを使用するときに特定の要素を対象とするために使用したり、CSS によって特定の要素を装飾するために使用することができる。

Identifiers are opaque strings. Particular meanings should not be derived from the value of the id attribute.

識別子(ID)は不明な文字列です(あるべきです)。ID 属性の値から、特定の意味が導かれるべきではありません(ID に特定の意味を持たせるべきではありません)。

Reference
W3C 原文;

HTML5 におけるスペース文字(空白文字)

HTML5 におけるスペース文字(空白文字)とは、スペース、タブ、改行、改ページが該当します。厳密には、次の通りです。

スペース
U+0020
タブ
U+0009
改行(LF)
U+000A
改行(CR)
U+000D
改ページ(FF)
U+000C
Reference
W3C 原文;