通过在jQuery中使用子索引获取第二个子元素

Question

如何获得div的第二个孩子

<div id="container">
   <h1>title</h1>
   <h1>another title</h1>
   <h3>tag</h3>
   <p>details</p>
</div>

我不想使用它的属性名称来访问它。例如$（“＃container h1：nth-​​of-type（1）”）; 有没有办法使用索引访问容器的子元素？

Answer 1

$('#container').children('h1').get(1)

Answer 2

从您的示例中，您想要：

$（'＃container h1：nth-​​of-type（1）'）

示例测试：https://jsfiddle.net/9u0xwsf6/

var item = $('#container h1:nth-of-type(1)').html();
alert("Item Data:" + item);

Answer 3

还有另一个选择器，您可以使用#container > *:nth-child(2) .. *选择所有元素

#container > *:nth-child(2){
  background : red;
}

<div id="container">
   <h1>title</h1>
   <h1>another title</h1>
   <h3>tag</h3>
   <p>details</p>
</div>

  

注意： :nth-child()索引从1开始。因此选择第二个   元素使用2，依此类推。