option 要素

4.10.10 option 要素

カテゴリー:
なし
この要素を使うことができるコンテキスト:
select 要素の子として
datalist 要素の子として
optgroup 要素の子として
コンテントモデル:
この要素が label 属性と value 属性を持つ場合: 空
この要素が label 属性を持つが value 属性を持たない場合: テキスト
この要素が label 属性を持たない場合: 要素間ホワイトスペースではないテキスト
コンテント属性:
グローバル属性
disabled - フォームコントロールを無効にするかどうか
label - ユーザーに見せるラベル
selected - 該当の選択肢をデフォルトで選択状態にするかどうか
value - フォームのサブミットに使う値
text/html におけるタグの省略:
option 要素の終了タグは、その option 要素の直後に別の option 要素が来るなら、または、直後に optgroup 要素が来るなら、または、親要素に他にコンテンツがないなら、省略することができます。
指定可能な ARIA role 属性 の値:
option (デフォルト - 指定不要), menuitem, menuitemradio, separator
指定可能な ARIA ステートとプロパティ属性:
グローバル aria-* 属性
許可ロールに該当する aria-* 属性
DOM インタフェース:
[NamedConstructor=Option(optional DOMString text = "", optional DOMString value, optional boolean defaultSelected = false, optional boolean selected = false)]
interface HTMLOptionElement : HTMLElement {
           attribute boolean disabled;
  readonly attribute HTMLFormElement? form;
           attribute DOMString label;
           attribute boolean defaultSelected;
           attribute boolean selected;
           attribute DOMString value;

           attribute DOMString text;
  readonly attribute long index;
};

option 要素は、select 要素の選択肢、または、datalist 要素のサジェストのリストの一部としての選択肢を表します。

select 要素の定義で説明されている特定の環境において、option 要素は、select 要素のプレースホルダー・ラベル・オプションになることができます。プレースホルダー・ラベル・オプションは、実際の選択肢を表すことはありませんが、select コントロールに対するラベルを表します。

disabled 属性は、論理属性です。option 要素は、disabled 属性が存在しているか、もしくは、disabled 属性が存在する optgroup 要素の子であれば、無効になります。

無効option 要素は、ユーザーインタラクション・タスクソースキューイングされる click イベントが、その要素で呼び出されないようにしなければいけません。

label 属性は、要素に対するラベルを提供します。option 要素のラベルは、label コンテント属性があれば、その値となります。なければ、この要素の text IDL 属性の値になります。

label コンテント属性は、指定されるなら、空であってはいけません。

value 属性は、要素に対する値を提供します。option 要素のは、value コンテント属性があれば、その値となります。なければ、この要素の text IDL 属性の値になります。

selected 属性は、論理属性です。これは、この要素のデフォルトの選択状態を表します。

option 要素の汚染状態は、論理値で表される状態なのですが、初期値は false です。これは、selected コンテント属性の追加や削除が何かしらの影響を及ぼすかどうかを制御します。

option 要素の選択状態は、論理値で表される状態なのですが、初期値は false です。指定されなかった場合を除き、この要素が生成されるとき、その選択状態は、この要素が selected 属性を持つなら、true にセットされなければいけません。option 要素の selected 属性が追加されたとき、その汚染状態が false なら、その選択状態は true にセットされなければいけません。option 要素の selected 属性が削除されたとき、その汚染状態が false なら、その選択状態は false にセットされなければいけません。

Option() コンストラクターに渡す引数が 3 つ以下の場合、第 3 引数に true (selected 属性がセットされることを意味します)を指定したとしても、選択状態の初期値に関わらず、常に false となります。第 4 引数を指定すると、コンストラクターを使う際の初期の選択状態を明示的にセットすることができます。

multiple 属性が指定されていない select 要素には、selected 属性がセットされた option 要素を子孫にひとつしか入れることができません。

option 要素のインデックスとは、同じ選択肢リストの中で、ツリー順で手前にある option 要素の数ことです。option 要素が選択肢リストにないなら、その option 要素のインデックスは 0 になります。

option . selected

該当の要素が選択されていれば true を、そうでなければ、false を返します。

値をセットして、該当の要素の現在の状態を変えることができます。

option . index

selectoptions のリストの中で、該当の要素のインデックスを返します。

option . form

該当の要素の form 要素があれば、それを返し、なければ、null を返します。

option . text

textContent と同じです。ただし、スペースは折り畳まれ、script 要素はスキップされます。

option = new Option( [ text [, value [, defaultSelected [, selected ] ] ] ] )

新しい option 要素を返します。

text 引数は、該当の要素のコンテンツをセットします。

value 引数は、value 属性をセットします。

defaultSelected 引数は、selected 属性をセットします。

selected 引数は、該当の要素が選択されているかどうかをセットします。省略されたら、たとえ defaultSelected 引数が true だとしても、該当の要素は選択されません。

disabled IDL 属性は、同じ名前のコンテント属性を反映しなければいけません。defaultSelected IDL 属性は、selected コンテント属性を反映しなければいけません。

label IDL 属性は、取得時においては、該当の要素のラベルを返さなければいけません。セット時においては、該当の要素の label コンテント属性を新たな値にセットしなければいけません。

value IDL 属性は、取得時においては、該当の要素のを返さなければいけません。セット時においては、該当の要素の value コンテンツ属性を新たな値にセットしなければいけません。

selected IDL 属性は、取得時においては、該当の要素の選択状態が true なら、true を返し、そうでなければ false を返さなければいけません。セット時においては、該当の要素の選択状態を新たな値にセットし、汚染状態を true にセットし、この要素にリセットの要求を引き起こさせなければいけません。

index IDL 属性は、該当の要素のインデックスを返さなければいけません。

text IDL 属性は、取得時においては、option 要素の子孫となるすべての Text ノードのデータをin ツリー順に結合したものから、連続したホワイトスペースを 1 つに縮めた結果を返さなければいけません。ただし、該当の option 要素の子孫となる HTML 名前空間script 要素または SVG 名前空間script 要素の子孫となるものは除きます。

セット時においては、text 属性は、該当の要素の textContent IDL 属性が新たな値にセットされたかのように振る舞わなければいけません。

form IDL 属性の挙動は、option 要素が select 要素の中にあるかどうかに依存します。option が親に select 要素を持つなら、または、親に optgroup 要素を持ち、その optgroup 要素が親に select 要素を持つなら、その form IDL 属性は、その select 要素の form IDL 属性と同じ値を返さなければいけません。そうでなければ、null を返さなければいけません。

HTMLOptionElement オブジェクトを生成するためにコンストラクタが提供されています(さらに、createElement() のように DOM の生成メソッドもあります):Option(text, value, defaultSelected, selected)。これは、コンストラクタとして呼び出されたら、新たな HTMLOptionElement オブジェクト(新たな option 要素)を返さなければいけません。第 1 引数が空文字列でなければ、その新たなオブジェクトは、唯一の子として、そのデータが引数の値となる Text ノードを持たなければいけません。そうでなければ、子を持ってはいけません。value 引数が存在したら、その新たなオブジェクトは、その値がその引数の値にセットされた value 属性を持たなければいけません。defaultSelected 引数が true なら、その新しいオブジェクトは、値がない selected 属性を持たなければいけません。selected 引数が true なら、その新たなオブジェクトの選択状態は true にセットされなければいけません。そうでなければ、たとえ defaultSelected 引数が true だとしても、その選択状態は false にセットされなければいけません。この要素のドキュメントは、呼び出されたコンストラクタのインタフェース・オブジェクトが見つけられる Window オブジェクトのブラウジングコンテキストアクティブドキュメントでなければいけません。


※ 原文:http://www.w3.org/TR/2014/REC-html5-20141028/forms.html#the-option-element