Option()

Option() コンストラクターは、新しい HTMLOptionElement を生成します。

構文

var optionElementReference = new Option(text, value, defaultSelected, selected);

引数

text 省略可: DOMString で、要素の内容、すなわち表示するテキストを表します。これが指定されていない場合は、 "" (空文字列) が既定値として使用されます。
value 省略可: DOMString で、この HTMLOptionElement の値、すなわち対応する <option> 要素の value 属性を表します。指定されなかった場合は、 text の値が value、例えば、フォームがサーバーへ送信されるときの <select> 要素の値として使用されます。
defaultSelected 省略可: true または false のどちらかの値で、 selected 属性の値を設定するものです。すなわち、ページが最初に読み込まれたときに、この <option> が <select> 要素で選択される既定値になるようにします。これが指定されていない場合は、既定値の false が使用されます。なお、 true を指定しても、その選択肢が selected になっていない場合は、 selected にはなりません。
selected 省略可: true または false のどちらかの値で、その選択肢の選択状態を設定します。既定値は false (未選択) です。省略された場合、 defaultSelected 引数が true であっても、その選択肢は選択されません。

例

単に新しい選択肢を追加する

 /* 以下の HTML があると想定する
<select id='s'>

</select>
*/

var s = document.getElementById('s');
var options = [Four, Five, Six];

options.forEach(function(element,key) {
    s[key] = new Option(element,key);
});

様々な引数で選択肢を追加する

/* 以下の HTML があると想定する
<select id="s">
    <option>First</option>
    <option>Second</option>
    <option>Third</option>
</select>
*/

var s = document.getElementById('s');
var options = [ 'zero', 'one', 'two' ];

options.forEach(function(element, key) {
  if (element == 'zero') {
    s[s.options.length] = new Option(element, s.options.length, false, false);
  }
  if (element == 'one') {
    s[s.options.length] = new Option(element, s.options.length, true, false); // "selected" 属性を追加する
  }
  if (element == 'two') {
    s[s.options.length] = new Option(element, s.options.length, false, true); // "view" の中で選択されるだけ
  }
});

/* 結果
<select id="s">
  <option value="0">zero</option>
  <option value="1" selected="">one</option>
  <option value="2">two</option> // ユーザーにはこれが 'selected' に見える
</select>
*/

仕様書

Specification
HTML Standard # dom-option-dev