Differenza tra le funzioni parent (), parent () e avvicina () di jQuery

184

Uso jQuery da un po 'di tempo. Volevo usare il parent()selettore. Ho anche pensato al closest()selettore. Impossibile trovare alcuna differenza tra di loro. C'è qualche? Se si cosa?

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

jquery

— Sajjan Gurung
fonte

6

genitore :::: fa un passo indietro verso il genitore .... :::: genitori ::: fornisce un elenco di tutti i genitori .... :::: più vicino ::: torna indietro attraverso i fratelli fino a trovare la condizione e restituisce solo il primo. Tutti questi possono essere modificati con selettori aggiuntivi

— Muhammad Umer del

177

closest()seleziona il primo elemento corrispondente al selettore, in alto dall'albero DOM. Inizia dall'elemento corrente e viaggia verso l'alto.

parent() seleziona un elemento in alto (livello singolo in alto) l'albero DOM.

parents()Il metodo è simile parent()ma seleziona tutti gli elementi corrispondenti nell'albero DOM. Inizia dall'elemento genitore e viaggia verso l'alto.

— Subash
fonte

10

Non è .parents()(invece di .parent()) che recupera tutti gli elementi?

— acdcjunior,

65

A questa risposta manca un punto importante: "Più vicino" inizia con l'elemento corrente e viaggia verso l'alto, mentre come "Genitori" inizia con l'elemento genitore e viaggia verso l'alto.

— Andrew,

196

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

I metodi .parents () e .closest () sono simili in quanto entrambi attraversano l'albero DOM. Le differenze tra i due, sebbene sottili, sono significative:

.più vicina()

Inizia con l'elemento corrente

Viaggia lungo l'albero del DOM fino a quando non trova una corrispondenza per il selettore fornito

L'oggetto jQuery restituito contiene zero o un elemento

.parents ()

Inizia con l'elemento genitore

Viaggia lungo l'albero del DOM fino all'elemento radice del documento, aggiungendo ciascun elemento antenato a una raccolta temporanea; filtra quindi quella raccolta in base a un selettore se ne viene fornito uno

L'oggetto jQuery restituito contiene zero, uno o più elementi

.genitore()

Dato un oggetto jQuery che rappresenta un insieme di elementi DOM, il metodo .parent () ci consente di cercare tra i genitori di questi elementi nella struttura DOM e costruire un nuovo oggetto jQuery dagli elementi corrispondenti.

Nota: i metodi .parents () e .parent () sono simili, tranne per il fatto che quest'ultimo percorre solo un singolo livello sull'albero DOM. Inoltre, il metodo $ ("html"). Parent () restituisce un set contenente documenti mentre $ ("html"). Parent () restituisce un set vuoto.

Ecco i thread correlati:

— Naveed
fonte

8

In realtà ha chiesto informazioni su parent (), non parent ().

— ScubaSteve,

2

@ScubaSteve: ricontrolla la risposta con Note.

— Naveed,

1

The .parents() and .parent() methods are similar, except that the latter only travels a single level up the DOM tree. Also, $("html").parent() method returns a set containing document whereas $("html").parents() returns an empty set.

— Naveed,

1

@ScubaSteve, sì, ma la domanda dei genitori () è più interessante.

— Paul Draper,

15

Le differenze tra i due, sebbene sottili, sono significative:

.più vicina()

Inizia con l'elemento corrente

Viaggia lungo l'albero del DOM fino a quando non trova una corrispondenza per il selettore fornito

L'oggetto jQuery restituito contiene zero o un elemento

.parents ()

Inizia con l'elemento genitore

Viaggia lungo l'albero del DOM fino all'elemento radice del documento, aggiungendo ciascun elemento antenato a una raccolta temporanea; filtra quindi quella raccolta in base a un selettore se ne viene fornito uno

L'oggetto jQuery restituito contiene zero, uno o più elementi

Dai documenti di jQuery

— antyrat
fonte

13

penso che tu stia descrivendo qui .parents ()

— Muhammad Umer del

1

C'è differenza tra entrambi $(this).closest('div')e$(this).parents('div').eq(0)

Fondamentalmente closestavvia la corrispondenza dell'elemento dall'elemento corrente mentre parentsinizia la corrispondenza degli elementi dal genitore (un livello sopra l'elemento corrente)

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

— Imran Kabir
fonte

0

parent()Il metodo restituisce l'elemento genitore diretto di quello selezionato. Questo metodo attraversa solo un singolo livello sull'albero DOM.

parents()Il metodo ci consente di cercare tra gli antenati di questi elementi nella struttura del DOM. Inizia da un determinato selettore e spostati verso l'alto.

The **.parents()** and **.parent()** methods are almost similar, except that the latter only travels a single level up the DOM tree. Also, **$( "html" ).parent()** method returns a set containing document whereas **$( "html" ).parents()** returns an empty set.

[closest()][3]method returns the first ancestor of the selected element.An ancestor is a parent, grandparent, great-grandparent, and so on.

This method traverse upwards from the current element, all the way up to the document's root element (<html>), to find the first ancestor of DOM elements.

According to docs:

**closest()** method is similar to **parents()**, in that they both traverse up the DOM tree. The differences are as follows:

**closest()**

Begins with the current element
Travels up the DOM tree and returns the first (single) ancestor that matches the passed expression
The returned jQuery object contains zero or one element

**parents()**

Begins with the parent element
Travels up the DOM tree and returns all ancestors that matches the passed expression
The returned jQuery object contains zero or more than one element

— Vaibhav Sharma
fonte

-1

$(this).closest('div')è lo stesso di $(this).parents('div').eq(0).

— hsuk
fonte

9

Non del tutto, se $ (questo) è anche un div.

— Frank Fajardo,