如何在jQuery中选择最后一个子元素？

Question

如何在jQuery中选择最后一个子元素？

刚刚过去的孩子，而不是它的后代。

Answer 1

你也可以这样做：

<ul id="example"> 
    <li>First</li> 
    <li>Second</li> 
    <li>Third</li> 
    <li>Fourth</li> 
</ul> 

// possible 1 
$('#example li:last').val(); 
// possible 2 
$('#example').children().last() 
// possible 3 
$('#example li:last-child').val(); 

:last

.children().last()

:last-child

Answer 2

通过使用:last-child selector？

你心里有一个特定的情况下，您需要帮助吗？

Answer 3

$('#example').children().last() 

，或者如果你想有一个最后的孩子有某一类如上评论。

$('#example').children('.test').last() 

或与特定类的特定子元素

$('#example').children('li.test').last() 

Answer 4

如果您想选择的最后一个孩子，需要具体的元素类型，你可以使用选择last-of-type

这里是一个例子：

$("div p:last-of-type").css("border", "3px solid red"); 
$("div span:last-of-type").css("border", "3px solid red"); 

<div id="example"> 
      <p>This is paragraph 1</p> 
      <p>This is paragraph 2</p> 
      <span>This is paragraph 3</span> 
      <span>This is paragraph 4</span> 
      <p>This is paragraph 5</p> 
     </div> 

在上面的例子中，bot h第4段和第5段将有红色边框，因为第5段是div中“p”型的最后一个元素，第4段是div中的最后一个“span”。