获取可见的特定选择器的实例(jQuery)

Getting instance of a specific selector that is visible (jQuery)

本文关键字：实例 jQuery 选择器 获取      更新时间：2023-09-26

我有这些元素，我想获得可见或不具有hide类的元素的位置。我知道我可以循环遍历所有元素并计数但有没有一种jQuery函数能让我用更少的代码只针对特定元素?

<div class="panel hide">1</div>
<div class="panel">2</div>
<div class="panel hide">3</div>
<div class="panel hide">4</div>
<div class="panel hide">5</div>

所以您想要div元素具有panel类但不具有hide类?

$('div.panel:not(.hide)');

查看这个工作示例

使用length属性获取jQuery集合中的元素数量:

var n = $('div.panel:not(.hide)').length;
这些东西在jQuery API中都是可用的。探索它，并养成在里面查找东西的习惯。
  • 类选择器
  • :not选择器
  • length property

要从它的兄弟元素中获取元素的位置，可以使用index:

var index = $('div.panel:not(.hide)').index();

例子

假设它们是父元素中的唯一元素。如果不是，则需要检查集合中相关元素的索引:

var allPanels = $('div.panel'),
    notHidden = allPanels.not('.hide'),
    index = allPanels.index(notHidden);

例子

请注意，这些仍然会显示1，因为index返回一个基于0的索引，即第一个元素是0，第二个是1，就像在数组中一样。

相关文章：