仅显示每个可见元素

Question

<div class="save" id="1">1</div>
<div class="save" id="2" style="display:none">2</div>
<div class="save" id="3">3</div>
<div class="save hide" id="4">4</div>
<div class="save" id="5">5</div>

.hide {
 display: none;
}

$('.save').each(function(){
   console.log($(this).attr('id'));
})

这告诉我:

1
2
3
4
5

但请注意:

1
3
5

我必须使用什么来遍历每个可见元素？

Answer 1

使用:visible选择器:

$('.save:visible').each(function(){
    console.log(this.id);
})

如果你已经拥有了你的.save元素,你可以filter:

var $saves = $(".save");
$saves.filter(':visible').each(function(){
    console.log(this.id);
})