jQuery Traversing - Fratelli
Con jQuery puoi attraversare lateralmente l'albero DOM per trovare fratelli di un elemento.
I fratelli condividono lo stesso genitore.
Attraversamento laterale nell'albero DOM
Esistono molti metodi jQuery utili per l'attraversamento laterale nell'albero DOM:
siblings()
next()
nextAll()
nextUntil()
prev()
prevAll()
prevUntil()
jQuery siblings() Metodo
Il siblings()
metodo restituisce tutti gli elementi di pari livello dell'elemento selezionato.
L'esempio seguente restituisce tutti gli elementi di pari livello di <h2>
:
Esempio
$(document).ready(function(){
$("h2").siblings();
});
Puoi anche utilizzare un parametro facoltativo per filtrare la ricerca di fratelli.
L'esempio seguente restituisce tutti gli elementi di pari livello <h2>
che sono <p>
elementi:
Esempio
$(document).ready(function(){
$("h2").siblings("p");
});
jQuery next() Metodo
Il next()
metodo restituisce l'elemento di pari livello successivo dell'elemento selezionato.
L'esempio seguente restituisce il fratello successivo di <h2>
:
Esempio
$(document).ready(function(){
$("h2").next();
});
jQuery metodo nextAll()
Il nextAll()
metodo restituisce tutti gli elementi di pari livello successivi dell'elemento selezionato.
L'esempio seguente restituisce tutti gli elementi di pari livello successivi di
<h2>
:
Esempio
$(document).ready(function(){
$("h2").nextAll();
});
Metodo jQuery nextUntil()
Il nextUntil()
metodo restituisce tutti gli elementi di pari livello successivi tra due argomenti dati.
L'esempio seguente restituisce tutti gli elementi di pari livello tra a <h2>
e un <h6>
elemento:
Esempio
$(document).ready(function(){
$("h2").nextUntil("h6");
});
jQuery metodi prev(), prevAll() e prevUntil()
I metodi prev()
, prevAll()
e prevUntil()
funzionano proprio come i metodi precedenti ma con funzionalità inversa: restituiscono elementi di pari livello precedenti (attraverso indietro lungo gli elementi di pari livello nell'albero DOM, anziché in avanti).
Esercizi jQuery
Riferimento per l'attraversamento di jQuery
Per una panoramica completa di tutti i metodi di jQuery Traversing, vai al nostro jQuery Traversing Reference .