HTMLSelectElement: add() 方法
HTMLSelectElement.add() 方法将一个元素添加到此 select 元素的 option 元素集合中。
语法
js
add(item)
add(item, before)
参数
返回值
无(undefined)。
异常
HierarchyRequestErrorDOMException-
如果传递给方法的item是
HTMLSelectElement的祖先,则会抛出该错误。
示例
从头开始创建元素
js
const sel = document.createElement("select");
const opt1 = document.createElement("option");
const opt2 = document.createElement("option");
opt1.value = "1";
opt1.text = "Option: Value 1";
opt2.value = "2";
opt2.text = "Option: Value 2";
sel.add(opt1, null);
sel.add(opt2, null);
/*
Produces the following, conceptually:
<select>
<option value="1">Option: Value 1</option>
<option value="2">Option: Value 2</option>
</select>
*/
before 参数是可选的。因此,以下内容是被接受的。
js
sel.add(opt1);
sel.add(opt2);
添加到现有集合
js
const sel = document.getElementById("existingList");
const opt = document.createElement("option");
opt.value = "3";
opt.text = "Option: Value 3";
sel.add(opt, null);
/*
Takes the existing following select object:
<select id="existingList">
<option value="1">Option: Value 1</option>
<option value="2">Option: Value 2</option>
</select>
And changes it to:
<select id="existingList">
<option value="1">Option: Value 1</option>
<option value="2">Option: Value 2</option>
<option value="3">Option: Value 3</option>
</select>
*/
before 参数是可选的。因此,以下内容是被接受的。
js
sel.add(opt);
插入到现有集合
js
const sel = document.getElementById("existingList");
const opt = document.createElement("option");
opt.value = "3";
opt.text = "Option: Value 3";
sel.add(opt, sel.options[1]);
/*
Takes the existing following select object:
<select id="existingList">
<option value="1">Option: Value 1</option>
<option value="2">Option: Value 2</option>
</select>
And changes it to:
<select id="existingList">
<option value="1">Option: Value 1</option>
<option value="3">Option: Value 3</option>
<option value="2">Option: Value 2</option>
</select>
*/
规范
| 规范 |
|---|
| HTML # dom-select-add-dev |
浏览器兼容性
加载中…