在前端开发中，经常需要对 DOM 元素进行操作。有时候，我们需要找到页面上所有可见的元素，并忽略那些被隐藏了的元素。在这篇文章中，我将介绍如何使用 jQuery 来实现这个功能。
为什么需要只查找可见元素？
在某些情况下，我们可能需要对页面上所有可见的元素进行操作，例如修改它们的样式、添加事件监听器等等。但是，如果页面上有一些被隐藏了的元素，这些操作可能会影响到这些元素，导致出现意想不到的结果。
为了避免这种情况的发生，我们可以使用 jQuery 提供的 :visible 选择器来仅选取可见元素。
如何使用 :visible 选择器？
:visible 选择器是 jQuery 中一个非常有用的选择器，它可以帮助我们仅选取可见的元素。该选择器的语法如下：
$(':visible')通过这个选择器，我们可以轻松地找到页面上所有可见的元素。比如下面的示例代码：
-- -------------------- ---- ------- ----- ------- -- - ------- -------------- -- -------------------------- -- - ------ -------------- ------ -------- ---------------------------- - -- --------- --------------------------- ------- --- ---------
在这个示例中，我们有两个段落元素，其中一个被隐藏了。通过使用 :visible 选择器，我们可以仅选取可见的那个段落元素，并将它的文字设置为红色。
总结
在本文中，我们介绍了如何使用 jQuery 中的 :visible 选择器来仅选取页面上可见的元素。这个功能在前端开发中非常有用，可以帮助我们避免对被隐藏元素的误操作。希望这篇文章对你有所帮助！
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/27326