javascript - 从 jQuery 对象集合中获取可见性

Question

我有这行代码：

var filterInputs = $(this).siblings('.filterInputs');

它对 filterInputs 执行一些工作。稍后，我想将我的 filterInputs 集合减少到仅可见的那些。

显然，我可以这样做：

var visibleFilterInputs = $(this).siblings('.filterInputs:visible');

但考虑到我已经参考了我希望减少的集合，这似乎效率低下。

有没有办法说这样的话：

//TODO: Example
var visibleFilterInputs = $(filterInputs:visible);

无需再次遍历 DOM 树？谢谢

score 3 · Accepted Answer

您是绝对正确的，没有理由重新收集 DOM 元素，因为您已经在 jQuery 对象中拥有它们。这正是该.filter()方法的用途：http ://api.jquery.com/filter/

试试这个：

var visibleFilterInputs = filterInputs.filter(":visible");

这是一个例子：http: //jsfiddle.net/FC9sH/

请注意，最好以特定 HTML 标记为目标，例如<div>，以使:visible选择器更有效率（因为它不是 CSS 规范的一部分，并且无法通过本机方法进行优化）。至少在您的情况下，您已经在使用filterInputs该类。无论如何，也许是这样的：

var visibleFilterInputs = filterInputs.filter("div:visible");

但只有在适用的情况下。我的意思是，即使选择多个已知元素标签也可能更好：

var visibleFilterInputs = filterInputs.filter("div:visible, p:visible");

1 回答 1