HTML | DOM 数据列表选项集合

数据列表选项集合用于设置或返回数据列表中所有选项值的集合。集合中的元素按排序顺序排列。

句法：

datalistObject.options

特性：

• length：用于返回集合中多个 元素。它是只读属性。

方法： DOM 选项集合包含三个方法，如下所示：

• [index]：用于返回选中索引的元素。索引值从 0 开始。如果索引值超出范围，则返回 NULL。
• item(index)：用于返回所选索引的元素。索引值从 0 开始。如果索引值超出范围，则返回 NULL。
• namedItem(id)：用于从具有给定 id 属性的集合中返回元素。如果 id 无效，则返回 NULL。

示例 1：返回选项长度值。

  

    
         
        GeeksForGeeks 
        
  
        DOM Datalist Option Collection
  
        
            Your Cars Name: 
            
            
                
                
                
                
                
            
        
  
        
        Submit
  
        
  
        
            function myGeeks() {
                
                // Return length of option.
                var g =
                 document.getElementById(
                   "cars").options.length;
  
                document.getElementById("sudo").innerHTML =
                    "There are " + g + " options in the list.";
            }
        
    
  

  

输出：

点击按钮前：

点击按钮后：

示例 2：返回特定索引的选项值。

  

    
         
        GeeksForGeeks 
        
  
        DOM Datalist Option Collection
  
        
            Your Cars Name: 
            
            
                
                
                
                
                
            
        
  
        
        
          Submit
      
  
        
      
  
        
            function myGeeks() {
                
                // Return the value of index 2.
                var g =
                document.getElementById("cars").options[2].value;
  
                
                
                document.getElementById("sudo").innerHTML =
                    g + " option is in 2nd index";
            }
        
    
  

  

输出 ：

点击按钮前：

点击按钮后：

支持的浏览器： DOM Datalist 选项集合属性支持的浏览器如下：

• 谷歌浏览器
• IE浏览器
• 火狐
• 歌剧
• 苹果浏览器