селектор jquery для подсчета количества видимых строк таблицы?

у меня есть этот 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. Как я могу это сделать?

4 52
jquery jquery-selectors

4 ответа:

можно использовать :visible селектор и .length такой:

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

если <table> сам не виден на экране (:visible возвращает false если какой-либо родитель скрыт, элемент не должен быть скрыт напрямую), затем используйте .filter(), например:

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

$('tr:visible').length

12

вы также можете просматривать определенные таблицы видимых строк

 var totalRow =  $('#tableID tr:visible').length;
 var totalRowWithoutHeader = totalRow-1;

на totalRowWithoutHeader дает общее количество строк, кроме строки заголовка.

6

$("tr:visible") получает вам результаты видимых строк, и я думаю, что вы можете это сделать .длина

3