Il selettore in relazione agli elementi in jQuery

La Selezione in relazione agli elementi mi permette di selezionare in base alle relazioni, come first-child, last-child, only-child, nth-child(), +, >

Sintassi dei selettori in base alla posizione in jQuery

$(':first-child') // seleziona il primo figlio
$('last-child')  // seleziona l'ultimo figlio
$(':nth-child(..)') // seleziona il figlio del genitore per indice (con un numero)
$(':only-child') // seleziona il figlio unico, quello che non ha dei fratelli
$('div > p') //seleziona i figli diretti
$('p + span') //seleziona dei sibilings

Esempio sui selettori in base alla posizione in jQuery

Codice della Lezione : Dei selettori in base alla posizione in jQuery

$(document).ready(function(){
    $('#button1').click(function(){
        // first child e last child - individuare primo figlio e l'ultimo figlio
        $('.boxTXT p:first-child').hide(4000);
        $('.boxTXT p:last-child').hide(4000);
    });
    $('#button2').click(function(){
        // seleziona il figlio del genitore, in questo caso il 3 figlio
        $('.boxTXT > p:nth-child(3)').hide(4000);
    });
    $('#button3').click(function(){
        // seleziona il figlio unico, quello che non ha dei fratelli
        $('.boxTXT span:only-child').hide(4000);
    });
    $('#button4').click(function(){
        // seleziona il figlio diretto con > 
        $('.boxTXT > p').hide(4000);
    });
    $('#button5').click(function(){
        // seleziona dei siblings
        $('p + note').hide(4000);
    });
});