<オプション> 要素

<option> 要素は、ドロップダウン ボックスのオプション (<select>、<optgroup>、または <datalist>) を表します。これは、HTMLOptionElement インターフェイスのインスタンスです。

プロパティ

HTMLElement インターフェイスのプロパティとメソッドの継承に加えて、HTMLOptionElement インターフェイスには次のプロパティがあります。

• disabled: 項目が選択可能かどうかを示すブール値。
• defaultSelected: 項目がデフォルトで選択されているかどうかを示すブール値。 true に設定すると、この項目の値は <select> のデフォルト値になります。
• form: <option> が配置されているフォーム要素を返します。どのフォームにも属さない場合は「null」を返します。このプロパティは読み取り専用です。
• index: ドロップダウン リスト全体におけるこのオプションの位置を示す整数。このプロパティは読み取り専用です。
• label: オプションの説明を示す文字列。このプロパティが設定されていない場合は、オプションのテキスト内容を返します。
• selected: オプションが選択されているかどうかを示すブール値。
• text: 文字列、このオプションのテキスト内容。
• value: 文字列、このオプションの値。フォームが送信されると、選択したアイテムのこの属性がアップロードされます。

Option() コンストラクター

ブラウザーは、HTMLOptionElement インスタンスを生成するための Option() コンストラクターをネイティブに提供します。

新しいオプション(テキスト、値、defaultSelected、選択済み)

4 つのパラメーターを受け入れます (すべてオプション)。

• text: このオプションのテキスト内容を示す文字列。省略した場合は空の文字列が返されます。
• value: このオプションの値を示す文字列。省略した場合、デフォルトで「text」属性の値が返されます。 -defaultSelected: 項目がデフォルトで選択されているかどうかを示すブール値。デフォルトは「false」です。たとえ「true」に設定されていても、項目の「selected」属性が「true」であることを意味するわけではないことに注意してください。
• selected: 項目が選択されているかどうかを示すブール値。デフォルトは「false」です。

var newOption = new Option('hello', 'world', true);

newOption.text // "こんにちは"
newOption.value // "ワールド"
newOption.defaultSelected // true
newOption.selected // false

上記のコードでは、「newOption」の「defaultSelected」属性は「true」ですが、選択されていません（つまり、「selected」属性は「false」です）。