簡單的JavaScript循環不工作

我不認爲用JavaScript尚未經歷過，所以我可能忽視的東西在這裏：簡單的JavaScript循環不工作

var products = document.getElementsByClassName('product'); 
var productsLength = products.length; 

for(var i = 0; i < productsLength; i++){ 
    var productGender = products[i].attr('data-gender'); 

    if(productGender === triggerVal){ 
    console.log('yes'); 
    } else { 
    console.log('no'); 
    } 
};

它說：products[i].attr不是一個函數

我應該能夠訪問它的權利？該產品只是一個列表項目。

謝謝！

來源

2015-10-19 Luc

這是正確的，'attr'是不是...使用'產品[I] .dataset.gender'來獲取特別的屬性 –

attr是一個jQuery方法，使用getAttribute

http://www.w3schools.com/jsref/met_element_getattribute.asp

來源

2015-10-19 13:45:36 Igor

不要使用W3school，添加MDN的鏈接作爲參考 – Tushar

var productGender = products[i].getAttribute('data-gender');

是你需要什麼，你已經使用jquerys .attr（）

來源

2015-10-19 13:46:04 BobbyTables

它返回null – Luc

啊，它的工作！所以如果足夠使用getAttribute總是更好的？ – Luc

那麼，DOM中的屬性是什麼？你能展示這些元素嗎？ – BobbyTables

到目前爲止獲得data-xyz屬性的最簡單方法對於一個元素是使用.dataset對象

eg你的情況

var productGender = products[i].dataset.gender;

MDN - https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/dataset

平常警告 - IE11 +只（其它瀏覽器都支持它多年） - 有沒有填充工具

，如果您需要早期IE瀏覽器的支持，然後使用= getAttribute("data-gender");作爲別人建議

來源

2015-10-19 13:50:38

也請爲數據集添加MDN鏈接，OP會更容易閱讀更多關於它的信息+1 – Tushar

這是因爲你在DOM元素上使用jquery函數。您應該使用原生javascript函數來檢索屬性值，或者您可以將元素轉換爲Jquery對象，然後繼續使用Jquery。

所以，與其

products[i].attr('data-gender');

，您可以：

$(products[i]).attr('data-gender');

來源

2015-10-19 13:58:36 Karolis

簡單的JavaScript循環不工作

回答

相關問題