在jQuery中使用：visible和：first-child

我试图在jQuery中一起使用“：visible”和“：first-child”伪选择器，但它似乎没有成功。 我有以下HTML：

 Item One Item One Item One  

以下jQuery调用：

 $("div a.action:visible:first-child").addClass("first"); 

但它似乎永远找不到合适的元素……它找到了第一个元素而不是第一个可见元素。 我甚至尝试交换选择器顺序“：first-child：visible”而不是“：visible：first-child”，这也不起作用。 有任何想法吗？

Answer 1

你的选择器

 $("div a.action:visible:first-child").addClass("first"); 

仅当A元素是父DIV的第一个子元素并且它是可见的时，才匹配它。

如果要获取第一个可见的A元素，则应使用.eq函数

 $("div a.action:visible").eq(0).addClass("first"); 

或者：第一个伪类

 $("div a.action:visible:first").addClass("first"); 

Answer 2

我不确定原因:visible:first-child不工作，但你可以试试

 $("div a.action:visible").eq(0).addClass("first"); 

Answer 3

据我所知，伪类选择器：first-child只匹配第一个孩子。 它不能通过添加一个必须也是可见的伪类来进一步指定。 你可能想尝试写作

 $("div a.action:visible:first").addClass("first"); 

而不是使用适当的CSS伪类。 JQuery文档：首先

Answer 4

您可能想尝试$( "div a.action:visible(:first-child))作为您的选择器，这就是jQuery在其API文档中指定使用多个伪数选择器的方式。