如何将nth-child选择器与jquery子选择器一起使用？

Question

这很好用：

  

$（＆＃34; #lement＆＃34;）。find（＆＃34;＆gt; tr＆gt; td＆gt; i＆gt; a＆＃34;）

但是我试图用n号子选择器说我想要一个特定的编号孩子。例如，我想：

  

$（＆＃34; #lement＆＃34;）。find（＆＃34;＆gt; tr＆gt; td＆gt; i＆gt; a：nth-​​child（3）＆＃34;）

我没有得到任何结果。有没有人对如何选择所有n号儿童有任何想法？提前谢谢！

Answer 1

首先，除非非常需要做直接后代（>）选择器，否则我不认为需要包含它们，您也可以适当缩短CSS选择器：

//Select 3rd <a> tag, within the context of #element td
$('a:nth-child(3)', '#element td');
   //or
$('#element td a:nth-child(3)')

小提琴：http://jsfiddle.net/KGWuK/

虽然目前提供问题的选择器仅在HTML structure为：

时才有效

 <td>
     <i>
         <a>One</a>
         <a>Two</a>
         <a>Three</a>
     </i>
 </td>    

这不是一种非常可取的标记样式。这是因为原始选择器正在选择<a>的直接子项的<i>个标记

Answer 2

我建议不要将find用作不需要的东西：

$("#element > tr > td > i > a:nth-child(3)")

这将找到位于元素内位于表格单元格内的标记内的标记。

的jsfiddle

Answer 3

看到你只有1 a没有兄弟姐妹，我想你是为你的筹码的第四个元素。

有一个jQuery方法：.eq()：

$("#element").find("> tr > td > i > a:eq(3)");

或更快：

$("#element").find("> tr > td > i > a").eq(3);