jQuery: How to count the number of elements which "display" isn't "none"?

I use show() and hide() to show and hide rows in a table.

How could I count the number of non-hidden rows (more accurately, rows with display != none) ?

Note that:

$('tr:visible').length

won't work because if the table itself has display=none, the result will always b开发者_如何学Ce 0.

Try this:

$('tr:not([style*="display: none"])').length

Example http://jsfiddle.net/infernalbadger/7LvD5/

Filter your rows based on their actual CSS property:

$('tr').filter(function() {
    return $(this).css('display') !== 'none';
}).length;

jquery selector to count the number of visible table rows?

Change !== to ===

Adding this to the mix. I found this to be a more reliable option.

function recount () {
    var numOfVisibleRows = jQuery('tr.itemtext:visible').length;
    document.getElementById("item_table_count").innerHTML = numOfVisibleRows;
}

I like this because my table itemtext is hiding rows in different ways. I hope it's useful.

See this question for more information: jquery selector to count the number of visible table rows?