如何使用javascript獲取元素的自定義屬性值

Question

如何從以下獲取名稱值？

<select id="product"> 
    <option name="name1" value="1">one</option> 
    <option name="name2" value="2">two</option> 
</select> 

我想這（加入。名稱到最後。.value的作品，.NAME沒有）

var select = document.getElementById("product"); 
select.onchange = function(){ 
    var selectedString = select.options[select.selectedIndex].name; 
    alert(selectedString); 
} 

感謝

Answer 1

使用getAttribute因爲name不是一個有效的屬性選項（所以name屬性沒有name屬性，當你設置它的name屬性時得到更新），因此你不能從name屬性（通過訪問elm.name）得到它。

var selectedString = this.options[this.selectedIndex].getAttribute('name'); 

更好的方式是使其成爲data-*屬性和使用dataset訪問它（在舊版本的瀏覽器不支持）。

<select name="model" id="model"> 
    <option data-name="name1" value="1">one</option> 
    <option data-name="name2" value="2">two</option> 
</select> 

和

this.options[this.selectedIndex].dataset.name; //or this.options[this.selectedIndex].getAttribute('data-name')