javascript - 根据数据属性值获取元素数量

Question

应该是一件简单的事情，但我不知道在哪里。

我想获取具有给定数据属性值的元素数量。

我有一些带有各种 data-size='values' 的 html 元素。需要获取每个值的项目数。

如果您查看下面的代码，我想获取“p”尺寸和“l”尺寸的数量

$('.overview li img').each(function () {

var s = $(this).data('size');

switch (s) {
    case 'p':
        r = 0.66667
        break;
    case 'l':
        r = 1.5
        break;
}

var imgW = $(this).css({
    width: h * r + 'px'
});

})

非常感谢任何帮助

干杯戴夫

Answer 1

您可以创建一个选择器来查找 data-size='p' 或 data-size='l'

var pCount = $(".overview li img[data-size='p']").length
var lCount = $(".overview li img[data-size='l']").length

此外，您可以使用选择器来消除 switch 语句，以仅循环使用 data-size='p' 或 data-size='l' 的元素。

Answer 2

使用一些计数器：

 var pCount = 0 
     ,lCount = 0;

 $('.overview li img').each(function () {
    //-----------
    case 'p':
        r = 0.66667; 
        pCount++;        //counter of 'p'
        break;
    case 'l':
        r = 1.5;
        lCount++;        //counter of 'l'
        break;
    //----

 });

 console.log( pCount, lCount );