Selettori di sintassi jQuery, sono esattamente la stessa cosa?

Question

Ci sono alcune preferenze che ho osservato per la sintassi di selezione come:

 $('#mydiv > a.selectMe').hide();
 $('#mydiv').children('a.selectMe').hide();

A me sembra un po 'confuso poiché la documentazione per jQuery è un po' ambigua qui:

" genitore > Restituzioni figlio: matrice Corrisponde a tutti gli elementi figlio specificati da " child " degli elementi specificati da "parent". & Quot;

e

" children (expr) Restituisce: jQuery Ottieni un set di elementi contenente tutti i figli immediati unici di ciascuno dei set di elementi corrispondenti. & Quot;

La domanda che deve essere chiarita nella MIA mente è se la prima forma restituisce TUTTI i figli / nipoti o solo i figli immediati come indica la seconda forma è vera. Uno di questi è il "selettore" modulo e l'altro in "attraversamento" sulle pagine della documentazione di jQuery, che per me sono compiti funzionali simili ma non esattamente la stessa cosa.

SO, le domande qui sono:
Quale forma è più veloce? Selezionano VERAMENTE la stessa cosa o il 'genitore > forma di bambino selezionare nipoti e figli immediati?

Answer 1

$ ('# # mydiv a.selectMe') - Trova tutte le ancore con la classe 'selectMe' che sono decenti del tag con ID " mydiv " ;. Questi potrebbero essere nidificati in profondità.

$ ('# mydiv > a.selectMe') - Trova figli immediati.

Per quanto riguarda quale è più veloce tra i tuoi due esempi di ottenere figli immediati ... Ho fatto delle prove a tempo per testare.

Avevo una pagina con 10.000 tag di ancoraggio con la classe 'selectMe', all'interno di un Div con ID 'mydiv'.

$("#mydiv").children("a.selectMe") - 485ms
$("#mydiv > a.selectMe") - 374ms

Fondamentalmente, è una differenza trascurabile anche se fare qualsiasi cosa usando i selettori è stato costantemente più veloce. Se hai ancore 10k su una pagina, stai affrontando un problema completamente diverso. : -)