Select add() メソッド

HTML DOM Select オブジェクト

定義と使用法

add() メソッドは下拉リストにオプションを追加するために使用されます。

ヒント：下拉リストからオプションを削除するには、 remove() メソッド。

実例

例1

下拉リストの末尾に「キウイ」オプションを追加します：

var x = document.getElementById("mySelect");
var option = document.createElement("option");
option.text = "キウイ";
x.add(option);

自分で試してみてください

例2

下拉リストの先頭に「キウイ」オプションを追加します：

var x = document.getElementById("mySelect");
var option = document.createElement("option");
option.text = "キウイ";
x.add(option, x[0]);

自分で試してみてください

例3

下拉リストのインデックス位置「2」に「キウイ」オプションを追加します：

var x = document.getElementById("mySelect");
var option = document.createElement("option");
option.text = "キウイ";
x.add(option, x[2]);

自分で試してみてください

例4

下拉リストで選択されたオプションの前にオプションを追加します：

var x = document.getElementById("mySelect");
if (x.selectedIndex >= 0) {
  var option = document.createElement("option");
  option.text = "キウイ";
  var sel = x.options[x.selectedIndex]; 
  x.add(option, sel);
}

自分で試してみてください

文法

selectObject選択肢を追加するためのoption, index)

パラメータの値

パラメータ 説明
option 必須。追加するオプションを指定します。option や optgroup 要素でなければなりません。
index

オプション。整数、新しいオプション要素が挿入されるべきインデックス位置を指定します。インデックスは0から始まります。

インデックスが指定されていない場合、新しいオプションはリストの最後に挿入されます。

技術的詳細

リターン値：

リターン値はありません。

ブラウザのサポート

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
サポート サポート サポート サポート サポート

HTML DOM Select オブジェクト