javascript - jQuery:如何映射隐藏的元素

Question

我的表中有一些 TR，其类为 parent_0。我正在使用 jQuery 的 map() 来获取 map 中未隐藏的所有元素。

DOM:

<table id="tableID" class="tableClass">
<tbody>
    <tr>
        <th width="3px">Header1</th>
        <th align="left">Header2</th>
    </tr>
    <tr align="left">
        <td>Data1</td>
        <td><a <i id="1" class="parent_0" ></i>></a>Data12</td>
    </tr>
    <tr align="left" style="display: none;">
        <td>Data2</td>
        <td><a <i id="2" class="parent_0"></i>></a>Data22</td>
    </tr>
</tbody>

jQuery:

$( document ).ready(function(){ 
    allChildern = $(".parent_0").map(function() {
        return this.id
    }).get();
    alert(allChildern)

    var allSubChildern = $(".parent_0").map(function() {
       if($('#'+this.id).closest('tr').is(':visible')){
           return this.id //its working but taking so much time for 1k records.
       }
    }).get();
    alert(allSubChildern)
});

是否有任何函数可以映射仅可见的元素。

这里是Fiddle 。谢谢。

Answer 1

您可以使用.filter()获取所有可见行，然后继续使用.map()

Reduce the set of matched elements to those that match the selector or pass the function's test.

var allSubChildern = $(".parent_0").filter(function(){
    return $(this).closest('tr').is(':visible');
}).map(function() {
    return this.id;
}).get();
alert(allSubChildern)

或者，您也可以使用

var allSubChildern = $("#tableID tr:visible .parent_0").map(function() {
    return this.id;
}).get();