選擇框是通過<select>和<option>元素創建的，除了通用的一些屬性外，HTMLSelectElement類型還提供了如下的屬性和方法：
在DOM中，每個<option>元素都有一個HTMLOptionElement對象，以便訪問數據，這個對象有如下一些屬性：
選擇框里的type屬性有可能是：select-one，也有可能是：select-multiple，這取決於HTML代碼中有沒有multiple屬性。
操作select時，最好使用HTML DOM，因為所有瀏覽器兼容很好。
當選擇沒有value值的時候，IE會返回空字符串，其他瀏覽器會返回text值。
選擇選項：
對於只能選擇一項的選擇框，使用selectedIndex屬性最為簡單。
如果是多項選擇，它始終返回的是第一個項。
通過option的屬性（布爾值），也可以設置某個索引，設置為true即可。
而selected和selectedIndex在用途上最大的區別是：selected是返回布爾值，所以一般用於判斷上；而selectedIndex是數值，一般用於設置和獲取。
添加選項：
需要動態添加選項有兩種方案：DOM和Option構造函數。
使用Option構造函數創建：
使用add()方法來添加選項：
在DOM規定，add()中兩個參數是必須的，如果不確定索引，那麼第二個參數設置null即可，即默認移入最後一個選項。但IE中規定第二個參數是可選的，所以設置null表示放入不存在的位置，導致失效，為了兼容，我們傳遞undefined即可兼容。
移出選項：
有三種方法可以移出某一個選項：DOM移出、remove()、null移出。
當第一項移出後，下面的項會往上頂，所以不停的移除第一項，即可全部移除。
移動選項：
如果有兩個選擇框，把第一個選擇框里的第一項移到第二個選擇框里，並且第一個選擇框里的第一項被移出。
排列選項：
選擇框里提供了一個index屬性，可以得到當前選項的索引值，和selectedIndex的區別是，一個是選擇框對象的調用，一個選項對象的調用。
單選按鈕：
通過checked屬性來獲取單選按鈕的值。
除了checked屬性之外，單選按鈕還有一個defaultChecked屬性，它獲取的是原本的checked按鈕對象，而不會因為checked的改變而改變。
複選框按鈕：
通過checked屬性來獲取複選框按鈕的值。它同樣也具有defaultChecked屬性。
原創文章，作者：投稿專員，如若轉載，請註明出處：https://www.506064.com/zh-hant/n/269573.html
微信掃一掃 
支付寶掃一掃 