这个nth-child为什么会返回一个意外的元素？

html & jQuery在下面，它也在http://www.jsfiddle.net/4fWUU。我期待得到'wrapper'的第二个孩子，它是id为'parent2'的div。但是，返回的ID是'child1_1_1_2'，我不期望。这个nth-child为什么会返回一个意外的元素？

我可以使用$o1.children()[1]得到正确的div，但我想知道为什么nth-child不能正常工作。

任何想法为什么？

<div id="wrapper"> 
     <div id="parent1"> 
      <div id="child1"> 
       <div id="child1_1"> 
        <div id="child1_1_1"> 
         <div id="child1_1_1_1"> 
         </div> 
         <div id="child1_1_1_2"> 
         </div> 
        </div> 
        <div id="child1_1_2"> 
        </div> 
       </div> 
       <div id="child1_2"> 
        <div id="child1_2_1"> 
        </div> 
       </div> 
      </div> 
     </div> 
     <div id="parent2"> 
     </div> 
    </div> 


var $o1 = $("#wrapper"); 
var id = $("div:nth-child(2)",$o1).attr("id"); 

alert(id);

来源

2011-02-08 Tony_Henrich

$（“> div：nth-child（2）”，$ o1）`将会是要走的路，或者更简单：`$（“＃wrapper> div：nth-child（2）”）``。 – 2011-02-08 19:36:54

上下文搜索相同.find()，其拾取向上行进DOM树之前最深后代第一。 :nth-child()不关心父母，如果你没有指定一个父母，因此每div包含（由（的孩子）#wrapper的某个其他元素或任何内部被选中。

.children()方法，正如它在锡上所说的，限制了对元素的选择，所以匹配的任何东西都是孩子。就用它来，但经过:nth-child()选择像这样：

var id = $o1.children('div:nth-child(2)').attr('id');

或者尼克Craver表明，使用子选择器>限制你的上下文搜索到的#wrapper孩子：如果你只希望当前

var id = $('> div:nth-child(2)', $o1).attr('id');

来源

2011-02-08 19:38:10 BoltClock

有实际上是选择器的4个实例：

var $o1 = $("#wrapper"); 
$("div:nth-child(2)",$o1).each(function() { 
     alert($(this).attr("id")); 
});

来源

2011-02-08 19:36:56

这个nth-child为什么会返回一个意外的元素？

回答

相关问题