Come selezionare l'ultimo elemento figlio in jQuery?

Question

Come selezionare l'ultimo elemento figlio in jQuery?

Solo l'ultimo figlio, non i suoi discendenti.

Answer 1

Si può anche fare questo:

<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

Utilizzando :last-child selector?

Hai in mente uno scenario specifico per il quale hai bisogno di assistenza?

Answer 3

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

o se si vuole un ultimo bambini con una certa classe, come commentato in precedenza.

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

o un elemento figlio specifico con una specifica classe

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

Answer 4

Se si desidera selezionare l'ultimo figlio e la necessità di essere precisi sul tipo di elemento è possibile utilizzare il selettore last-of-type

Ecco un esempio:

$("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> 

Nell'esempio sopra bot h Il paragrafo 4 e il paragrafo 5 avranno un bordo rosso poiché il paragrafo 5 è l'ultimo elemento del tipo "p" nel div e il paragrafo 4 è l'ultimo "span" nel div.