jquery选择器来计算可见表行数？

Question

我有这个html:

<table>
    <tr style="display:table-row"><td>blah</td></tr>
    <tr style="display:none"><td>blah</td></tr>
    <tr style="display:none"><td>blah</td></tr>
    <tr style="display:table-row"><td>blah</td></tr>
    <tr style="display:table-row"><td>blah</td></tr>
</table>

我需要计算没有具有display:none的行数。我怎样才能做到这一点？

Answer 1

您可以使用 :visible selector和 .length 像这样:

var numOfVisibleRows = $('tr:visible').length;

如果<table>本身在屏幕上不可见(如果任何父级被隐藏， :visible 返回 false，该元素不必直接隐藏)，然后使用 .filter() ，像这样:

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