HTML | DOM 选择对象

HTML DOM 中的Select 对象用于表示 HTML 元素。 元素可以使用 document.createElement() 方法创建，并且可以使用 getElementById() 访问。

句法：

• 它用于创建 元素。

  document.createElement("SELECT")

  它用于访问
  元素。

  document.getElementById("mySelect")

选择对象属性：

• autofocus：用于设置或返回下拉列表在页面加载时自动获得焦点。
• disabled：用于设置或返回下拉列表是否禁用。
• form：它返回对包含下拉列表的表单的引用。
• length：它返回下拉列表中 元素的数量。
• multiple：用于设置或返回是否可以从下拉列表中选择多个选项。
• name：用于设置或返回下拉列表的name属性的值。
• selectedIndex：用于设置或返回下拉列表中所选选项的索引。
• size：用于设置或返回下拉列表大小的值。
• type：它返回表单元素的类型一个下拉列表。
• value：用于设置或返回下拉列表中选中选项的值。

选择对象方法：

• add()：用于向下拉列表中添加选项。
• checkValidity()：用于检查下拉列表的有效性。
• remove()：用于从下拉列表中删除一个选项。

选择对象集合：

• options：它返回下拉列表中所有选项的集合。

下面的程序说明了 HTML DOM 中的 Select Object：

示例 1：此示例使用 document.createElement() 方法创建 元素。

      
 
    
        HTML DOM Select Object
     

  

    GeeksforGeeks 
      
    HTML DOM Select Object 
      
    
        Click on button to create select
        and option element
    
      
    
        Create Select Element
    
      
    
    
        function myGeeks() {
            var sel = document.createElement("Select");
            sel.setAttribute("id", "MySelect");
            document.body.appendChild(sel);
              
            var opt = document.createElement("option");
            opt.setAttribute("value", "gfg");
            var nod = document.createTextNode("gfg");
            opt.appendChild(nod);
            document.getElementById("MySelect").appendChild(opt);
        }
      
    

  
                                                           

输出：
点击按钮前：

点击按钮后：

示例 2：此示例使用 getElementById() 方法访问

元素。

      
 
    
        HTML DOM Select Object
     

  

  
    GeeksforGeeks 
      
    HTML DOM Select Object 
      
    
        Fork Python
        Fork Java
        Fork CPP
        Sudo Placement
    
      
    
        Click on button to get the number
        of option elements
    
      
    
        Create Select Element
    
      
    
      
    
    
        function myGeeks() {
            var len = document.getElementById("GFG").length;
            document.getElementById("test").innerHTML = len;
        }
    

  
                                                            

输出：
点击按钮前：

点击按钮后：

支持的浏览器： DOM Select Object支持的浏览器如下：

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