[2] ID選択子selectorは、指定された識別子を持つ要素に一致します。

仕様書

意味

[4] ID選択子は識別子が一致する要素と一致します。

[5] 識別子は文書中の唯一の要素に割り当てられた文字列です。 HTML では id 属性によって指定できます。他のマーク付け言語では他の方法で指定できます。 >>1

[8] 1つの要素に複数の識別子があるかもしれませんが、そのいずれもが識別子として扱われます。 >>1

[98] WebVTT ではWebVTT節点オブジェクトのリストが cue の text track cue identifier によって表される識別子を持つものとみなされます。 >>97

[104] WebVTT節点オブジェクトのリストは要素ではなく文書節点に相当するものであるように >>97 にはあります。 >>4 とは矛盾するかもしれませんが・・・。

構文

[3] ID選択子は、 # の直後に CSS 識別子を続けたものです >>1。

[16] CSS 2.1 や選択子の仕様書上に示された文法では HASH 字句であり、 # の後に名前文字を使える (識別子に使える文字で、先頭の文字の制約なし) ということになっています。ですが仕様書本文で >>3 の通り識別子でなければならないとされているため、 やはり先頭に数字などを使うことはできません。実際に Webブラウザーもそのように実装しています。

[18] にも関わらずそのように字句化されるのは、 <color> が # の後に十六進数が続く構文を使っているためです。

識別子の指定

[6] 選択子の仕様としては利用者エージェントがどのように識別子を知るかは規定しないとしています。 ハードコード、DTD、利用者にたずねるといった方法が例示されています。 また具体的な例として、 DOM3 Core (isId など) や xml:id も挙げられています。 >>1

[7] 従って、あるいは XML の DTD の処理が義務付けられていない故、 利用者エージェントは特定の属性が識別子であると知らないかもしれず、 その場合著者はID選択子よりも属性選択子を使うべきかもしれません。 >>1

大文字と小文字

[93] 選択子仕様書はID選択子の大文字と小文字について明確に言及していませんが、 属性値に関する選択子であり、属性値の大文字と小文字の区別はマーク付け言語依存との規定があります。

[94] 奇癖モードでの比較はASCII大文字・小文字不区別です >>181。

[182] それ以外、すなわち XML文書、無奇癖モードまたは限定奇癖モードについて明記している仕様書はありませんが、 区別するものと解されています。[183] HTML要素以外の要素も、奇癖モードでは大文字と小文字は区別されません。[184] 区別されないのは比較時点なので、CSSOM 上は指定されたとおりの大文字と小文字のままになります。

歴史

CSS1

  • [11] Cascading Style Sheets: a draft specification ( 版) http://www.w3.org/Style/CSS/draft4.html#id
  • [13] Cascading Style Sheets: a draft specification ( 版) http://www.w3.org/Style/CSS/draft5.html#id
  • [14] Cascading Style Sheets, level 1 ( 版) http://www.w3.org/TR/WD-css1-951209.html#id
  • [10] Cascading Style Sheets, level 1 ( 版) http://www.w3.org/TR/CSS1/#id-as-selector

[12] ID選択子は >>11 ではじめて言及されました。 >>13 で構文が定義されましたが、 これは属性選択子の部分集合でした。

[15] >>14 以後は現在と同じ構文になっています。

CSS2 / 選択子3

  • [9] Selectors ( 版) http://www.w3.org/TR/CSS2/selector.html#id-selectors
  • [91] Selectors Level 3 ( 版) http://www.w3.org/TR/selectors/#id-selectors

[92] CSS2 以降 XML にも対応しています。 CSS 2.1 と選択子3は DOM3 などによって複数の ID が1つの要素に与えられ得ることにも言及しています (これは CR で at risk とされてましたが、 結局残っています)。

HTML

  • [90] Web Applications 1.0 r6695 Update selector case-sensitivity matching rules, including dropping the list of magically case-insensitive values. ( ( 版)) http://html5.org/tools/web-apps-tracker?from=6694&to=6695

[96] >>90 でこれまで明記されていなかった HTML と XML における ID識別子の大文字と小文字の扱いが規定されました (>>94)。

WebVTT (2010)

  • [99] WebVTT Standard ( 版) http://dev.w3.org/html5/webvtt/#pseudo-cue-selector

[100] WebVTT 仕様書はID選択子が WebVTT に適用される場合の解釈を規定しています。

CSS Images

[101] CSS Images は ID選択子が ID だけでなくCSS要素参照識別子をも参照すると規定していましたが、 2012年3月に一旦該当する条項が削除されています。

[103] 文書に挿入されていない要素すら参照できるとされていました。
  • [102] csswg: changeset 5153:8a651e76cd87 ( 版) http://dvcs.w3.org/hg/csswg/rev/8a651e76cd87

奇癖モード (2014)

[180] 奇癖モードでASCII大文字・小文字不区別なのはHTML要素に限らないため、 HTML Standard から Selectors へと規定が移動されました。

  • [177] Bug 23781 – id and class should be case-insensitive in quirks ( 版) https://www.w3.org/Bugs/Public/show_bug.cgi?id=23781
  • [178] ID/class quirk moved to Selectors spec. Fixes https://www.w3.org/Bugs/Pu... · cfda1c1 · whatwg/quirks ( 版) https://github.com/whatwg/quirks/commit/cfda1c1f6d689072118b8e6a9a023f268d3c76be
  • [179] Web Applications 1.0 r8610 The quirky class/id selector matching case logic moved to selectors ( 版) http://html5.org/tools/web-apps-tracker?from=8609&to=8610

関連

[185] ID選択子は素片識別子と似ています。おそらく敢えて似せた構文にしたのでしょうが、 両者に直接の関係はありません。ID選択子では CSS のエスケープなどの構文が適用され、 素片識別子には URL のパーセント符号化などの構文が適用されます。

[186] Web Applications 1.0 r8764 Try to clarify case matching rules for selectors ( ( 版)) http://html5.org/r/8764

[19] Clarify case-sensitivity of ID and class attribute selectors (Zirro著, ) https://github.com/whatwg/html/commit/942a9d5b9c0b50bf5bca275e866bb2319ebdca0c