Metodo parents() di jQuery per l'intercettazione

Esempio

Trova tutti i genitori di ciascun elemento b:

$("b").parents()

Prova a farlo tu stesso

Definizione e uso

parents() ottiene gli elementi antenati di ciascun elemento nella raccolta di elementi corrispondenti, l'uso di un selettore per la筛选 è opzionale.

.parents()selector)
Parametro Descrizione
selector Valore di stringa, che contiene l'espressione di selettore utilizzata per abbinare gli elementi.

Spiegazione dettagliata

Se viene fornito un oggetto jQuery che rappresenta un insieme di elementi DOM, il metodo .parents() ci permette di cercare gli elementi antenati di questi elementi nel DOM e di costruire un nuovo oggetto jQuery con gli elementi corrispondenti ordinati dalla posizione più vicina all'elemento genitore. Gli elementi vengono restituiti nell'ordine da più vicino all'elemento genitore verso l'esterno. .parents() e .parent() Il metodo è simile, ma l'ultimo esplora un singolo livello dell'albero DOM.

Questo metodo accetta un'espressione di selettore opzionale, dello stesso tipo dei parametri passati alla funzione $(). Se viene applicato questo selettore, gli elementi vengono filtrati verificando se corrispondono al selettore.

Pensa a questa pagina con una lista annidata di base:

<ul class="level-1">
  <li class="item-i">I</li>
  <li class="item-ii">II
    <ul class="level-2">
      <li class="item-a">A</li>
      <li class="item-b">B
        <ul class="level-3">
          <li class="item-1">1</li>
          <li class="item-2">2</li>
          <li class="item-3">3</li>
        </ul>
      </li>
      <li class="item-c">C</li>
    </ul>
  </li>
  <li class="item-iii">III</li>
</ul>

Se partiamo dall'elemento A, possiamo trovare i suoi elementi antenati:

$('li.item-a').parents().css('background-color', 'red');

Prova a farlo tu stesso

Il risultato della chiamata è che l'elemento level-2, l'elemento II e l'elemento level-1 e altri elementi (fino a <html> lungo l'albero DOM) hanno impostato lo sfondo rosso. Poiché non abbiamo applicato l'espressione del selettore, l'elemento genitore è naturalmente diventato parte dell'oggetto. Se è stato applicato un selettore, viene verificato se l'elemento corrisponde al selettore prima di includere l'elemento. Poiché non abbiamo applicato l'espressione del selettore, tutti gli elementi antenati sono diventati parte dell'oggetto jQuery restituito. Se è stato applicato un selettore, includerà solo gli elementi che corrispondono.