Question

Should be a simple thing, but I’m getting no where.

I want to get the number of elements with a given data-attribute value.

I have some html elements with various data-size=’values’. Need to get the number of items with each value.

If you look at the code below, I want to get the number of ‘p’ sizes and ‘l’ sizes

$('.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'
});

})

any help greatly appreciated

cheers
dave

Answer 1

You can just create a selector that looks for data-size=’p’ or data-size=’l’

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

Also, you can use the selector to eliminate the switch statement to just loop over elements with data-size=’p’ or data-size=’l’.