在 jquery 行中隐藏除显示的一个匹配项之外的所有匹配项

Question

SO 上似乎有很多答案可以隐藏选择器的一个元素以外的所有元素，例如

$('li').not('.shown').hide()

但这并没有明确地 show() 元素 <li class="shown"> 如果它之前被隐藏了。为了解决这个问题，其他 SO 答案建议使用 2 线，其缺点是先隐藏所有元素，然后显示一个，这可能会导致闪烁：

$('li').hide()
$('li.shown').show()

是否有我可以使用的 jQuery 语法，它可以在单个循环中执行此操作？我不确定是否

$('li').hide().filter('.shown').show()

会这样做，或者是否只是简单地与 2 衬里一样，首先循环遍历所有匹配项，然后再重新打开一个。

Answer 1

您可以在隐藏 li 时使用 $.not('.shown') 或 :not(.shown) 将两者链接起来，然后使用 $.end() 并使用 $.filter('.shown').show()

$('li').not('.shown').hide().end().filter('.shown').show();

.shown {
  display: none;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<li>asdf</li>
<li>foo</li>
<li class="shown">show</li>
<li>bar</li>

在 jquery 行中隐藏除显示的一个匹配项之外的所有匹配项

Hide all but one match, which is shown, in one jquery line

jquery

show

hide