Datalist options 集合
实例
找出特定 <datalist> 元素中有多少个选项:
var x = document.getElementById("browsers").options.length;
x 的结果将是:
5
亲自试一试 »
页面下方有更多实例。
定义和用法
options 集合返回 <datalist> 元素中所有选项的集合。
注释: 集合中的元素按其在源代码中的显示进行排序。
浏览器支持
集合 | |||||
---|---|---|---|---|---|
options | Yes | 10.0 | Yes | Yes | Yes |
语法
datalistObject.options
属性
属性 | 描述 |
---|---|
length | 返回集合中 <option> 元素的数量。 注意: 此属性是只读的 |
方法
方法 | 描述 |
---|---|
[index] | 返回集合中指定索引(从 0 开始)对应的 <option> 元素 。 注释: 如果索引号超出范围,则返回 null |
item(index) | 返回集合中指定索引(从 0 开始)对应的 <option> 元素 。 注释: 如果索引号超出范围,则返回 null |
namedItem(id) | 返回集合中指定索引 id 对应的 <option> 元素。 注释: 如果 id 不存在,则返回 null |
技术细节
DOM 版本: | Core Level 2 Document Object |
---|---|
返回值: | 一个 HTMLCollection 对象,表示 <datalist> 元素中的所有 <option> 元素。 集合中的元素按照它们在源代码中出现的方式排序 |
更多实例
实例
[index]
获取数据列表中第一个选项(索引 0)的值:
var x = document.getElementById("browsers").options[0].value;
x 的结果将是:
Internet Explorer
亲自试一试 »
实例
item(index)
获取数据列表中第一个选项(索引 0)的值:
var x = document.getElementById("browsers").options.item(0).value;
x 的结果将是:
Internet Explorer
亲自试一试 »
实例
namedItem(name_or_id)
获取datalist中 id="google" 选项的值:
var x = document.getElementById("browsers").options.namedItem("google").value;
x 的结果将是:
Chrome
亲自试一试 »
实例
遍历数据列表中的所有选项,并输出选项值:
var x = document.getElementById("mySelect");
var txt = "";
var i;
for (i = 0; i < x.options.length; i++) {
txt = txt + x.options[i].value + "<br>";
}
txt 的结果将是:
Internet Explorer
Firefox
Chrome
Opera
Safari
亲自试一试 »
❮ Datalist Object