JavaScript DOM Datalist 对象 options 集合

• 

  Datalist 对象 options 集合

  options集合返回<datalist>元素中所有选项的集合。

  注意：集合中的元素按源代码中的显示进行排序。

  找出特定<datalist>元素中有多少选项：

  var x = document.getElementById("browsers").options.length;

  尝试一下
• 

  浏览器支持

  项	IE/Edge	Chrome	FireFox	Safari	Opera
  集合
  options	10.0+	支持	支持	支持	支持

• 

  语法

  返回options集合：

  DatalistObject.options
• 

  属性

  值	描述
  length	返回集合中<option>元素的数量。注意：此属性是只读的

• 

  方法

  值	描述
  [index]	返回具有指定索引的集合中的<option>元素（从0开始）。 注意：如果索引号超出范围，则返回null
  item(index)	返回具有指定索引的集合中的<option>元素（从0开始）。 注意：如果索引号超出范围，则返回null
  namedItem(id)	返回具有指定标识的集合中的<option>元素。 注意：如果id不存在，则返回null

• 

  技术细节

  项目	描述
  返回值	一个HTMLCollection对象，表示<datalist>元素中的所有<option>元素。集合中的元素按照它们在源代码中的显示进行排序

• 

  更多例子

  获取datalist中第一个选项（索引0）的值：

  var x = document.getElementById("browsers").options[0].value;

  尝试一下

  获取datalist中第一个选项（索引0）的值：

  var x = document.getElementById("browsers").options.item(0).value;

  尝试一下

  在datalist中获取id =“google”选项的值：

  var x = document.getElementById("browsers").options.namedItem("google").value;

  尝试一下

  循环遍历datalist中的所有选项，并输出选项值：

  var x = document.getElementById("mySelect");
  var txt = "";
  var i;
  for (i = 0; i < x.options.length; i++) {
    txt = txt + x.options[i].value + "<br>";
  }

  尝试一下