如何使用數據集訪問數據屬性值

Question

http://jsfiddle.net/bald1/Su97P/2/ 

我不知道這段代碼有什麼問題。我想點擊綠色的div，然後點擊添加「data-productName」到「cart」。

var cart = []; 
var cartElement = document.getElementById("cart"); 



function addToCart(productName) { 
    cart.push(productName); 
    cartElement.innerHTML = cart.join("<br>"); 
} 


var someDiv = document.getElementById("product"); 

someDiv.addEventListener("click", function() { 
    var str = someDiv.dataset.productName; 

    addToCart(str); 

}, false); 

Answer 1

將其更改爲productname，因爲數據屬性在你的情況（駝峯格式在更多的連字符的情況下，第一個後），小寫字母，並添加到數據集，你需要訪問它作爲productname而不是productName 。

someDiv.addEventListener("click", function() { 
    var str = someDiv.dataset.productname; 
    addToCart(str); 
}, false); 

productName將努力有你的屬性已經data-product-name。

有關規則，請參閱documentation。

• 任何破折號（U + 002D）被刪除;
• 破折號後面的任何字母（U + 002D），在刪除之前，都被設置爲大寫字母。