Di fronte a jQuery's .Closest (Top/Far-Most?)

Question

Ho un codice con molti sottomenu che condividono lo stesso nome di classe.

Ecco una struttura:

.menu 
    .sub-menu 
    .sub-menu 
    .sub-menu 
    .sub-menu 
    .sub-menu 
    .sub-menu 
     .elem 
     .elem 
    .sub-menu 

noti che .sub-menu possono essere infiniti livelli di profondità.

Quindi, come ottenerlo: quando si fa clic su .elem, si desidera attraversare il DOM verso l'alto finché non viene raggiunto il massimo .sub-menu e applicare uno stile su di esso. Sono a conoscenza di .closest() e .parent() e .find(), ma non ho idea se jQuery abbia funzionalità come .topMost(selector)?

L'unico modo che posso pensare è forse l'esecuzione di un ciclo e passando attraverso .closest('.sub-menu') del nuovo elemento fino a quando la sua lunghezza è pari a zero (non ci sono più i genitori con questa classe, quindi deve essere il più in alto). Tuttavia, penso che dovrebbe esserci un approccio più pratico a questo.

Answer 1

Supponendo che da 'opposto del più vicino' si desidera che il 'lontana' elemento padre, è possibile utilizzare parents().last(), in questo modo:

$('.elem').click(function() { 
    var $topSubMenu = $(this).parents('.sub-menu').last(); 
}); 

nota, si vuole l'ultimo elemento della matrice come jQuery attraversa il DOM, quindi l'elemento di primo livello sarà l'ultimo della collezione.

Answer 2

La domanda è leggermente fuorviante come. closest() potrebbe essere interpretato erroneamente. In realtà significa cercare l'albero fino a quando non viene trovata la prima partita. Quindi l'opposto è la ricerca lungo l'albero finché non viene trovata una corrispondenza e tale metodo è. first().

Per trovare tutti i discendenti uno può utilizzare find(). L'opposto di find() è parents().

vicini() (tutti i livelli) Per ciascun elemento dell'insieme, ottenere il primo elemento che corrisponde al selettore testando l'elemento stesso e traslazione attraverso i suoi antenati nell'albero DOM.

primi() (tutti i livelli) Diminuire le serie di elementi abbinati alla prima nel set

genitori() (tutti i livelli) ottenere l'antenati di ogni elemento nel set corrente di elementi corrispondenti, opzionalmente filtrati da un selettore.

genitore() (livello successivo solo) ottenere il padre di ciascun elemento della attuale serie di elementi accoppiati, eventualmente filtrato da un selettore.

find() (tutti i livelli) I discendenti di ciascun elemento della attuale serie di elementi accoppiati, filtrato da un selettore, oggetto jQuery, o elemento.