2012-02-08 15 views
144

Utilizzo jQuery da un po 'di tempo. Volevo utilizzare il selettore parent(). Ho anche trovato il selettore closest(). Non ho trovato alcuna differenza tra loro. C'è qualche? Se si, cosa?Differenza tra le funzioni jQuery parent(), parents() e closer()

Qual è la differenza tra parent(), parents() e closest()?

+5

genitore ::: : viaggia 1 passo indietro verso il genitore .... :::: genitori ::: fornisce un elenco di tutti i genitori .... :::: il più vicino ::: torna indietro tra i fratelli finché non trova la condizione e restituisce solo il primo. Tutti questi possono essere modificati con selettori aggiuntivi –

+0

Alcune informazioni qui relative a genitori, genitori, più vicino: http://markupjavascript.blogspot.in/2013/10/parent-parents-closest-what-is-difference.html –

risposta

129

closest() sé seleziona il primo elemento che corrisponde al selettore, in su dall'albero DOM.

parent() seleziona un elemento nell'albero DOM.

parents() metodo è simile a parent() ma seleziona tutti gli elementi corrispondenti l'albero DOM.

+10

Non è '.parents()' (invece di '.parent() ') che recupera * tutti * gli elementi? – acdcjunior

+40

In questa risposta manca un punto importante: "Più vicino" inizia con l'elemento corrente e viaggia verso l'alto, dove "Genitori" inizia con l'elemento genitore e viaggia verso l'alto. – Andrew

11

Le differenze tra i due, anche se sottili, sono significativi:

.closest()

  • inizia con l'elemento corrente
  • Travels l'albero DOM finché non trova una corrispondenza per la dotazione selettore
  • L'oggetto jQuery restituito contiene zero o un elemento

.parents()

  • inizia con l'elemento padre
  • Viaggi sull'albero DOM per elemento radice del documento, aggiungendo ogni elemento antenato di una collezione temporanea; allora filtra che collezione basata su un selettore se uno è fornito
  • L'oggetto jQuery restituito contiene zero, uno o più elementi

Da jQuery docs

+13

penso che il tuo descrivendo .parents() qui –

164

da http://api.jquery.com/closest/

I .parents() e .closest() I metodi sono simili in quanto b o attraversare l'albero DOM. Le differenze tra i due, però sottili, sono significative:

.closest()

  • inizia con l'elemento corrente
  • viaggia fino l'albero DOM finché non trova una corrispondenza per selettore fornito
  • L'oggetto jQuery restituito contiene zero o un elemento

.genitori()

  • inizia con l'elemento padre
  • Viaggi sull'albero DOM per elemento radice del documento, aggiungendo ogni elemento antenato di una collezione temporanea; allora filtra che collezione basata su un selettore se uno è fornito
  • La restituito oggetto jQuery contiene zero, uno o più elementi

.parent()

  • Dato un oggetto jQuery che rappresenta un insieme di elementi DOM, il metodo .parent() ci consente di cercare tra i genitori di questi elementi nell'albero DOM e creare un nuovo oggetto jQuery f rom degli elementi di corrispondenza .

Nota: metodiI .parents() e .parent() sono simili, tranne che la quest'ultimo viaggia solo un singolo livello sull'albero DOM. Inoltre, il metodo $ ("html"). Parent() restituisce un set contenente un documento mentre $ ("html"). Parents() restituisce un set vuoto.

Qui sono discussioni correlati:

+8

In realtà ha chiesto informazioni su genitore(), non su genitori(). – ScubaSteve

+2

@ScubaSteve: verificare di nuovo la risposta con 'Note'. – NAVEED

+1

'I metodi .parents() e .parent() sono simili, tranne per il fatto che il secondo sposta solo un singolo livello nell'albero DOM. Inoltre, il metodo $ ("html"). Parent() restituisce un set contenente un documento mentre $ ("html"). Parents() restituisce un set vuoto. – NAVEED

0

$(this).closest('div') è uguale a $(this).parents('div').eq(0).

+5

Non proprio, se $ (questo) è anche un div. –

1

c'è differenza tra i due $(this).closest('div') e $(this).parents('div').eq(0)

Fondamentalmente closest inizio elemento corrispondente dall'elemento corrente che parents elementi corrispondenti inizio dal padre (un livello superiore dell'elemento corrente)

See http://jsfiddle.net/imrankabir/c1jhocre/1/ 
Problemi correlati