jQuery Browsen - Ouders

Opa's zijn vader, grootvader of overgrootvader enz.

Met jQuery kunt u omhoog navigeren in de DOM-baam om opa's van elementen te vinden.

Navigeren in de DOM-baam omhoog

Deze jQuery methoden zijn zeer nuttig, ze worden gebruikt om omhoog te navigeren in de DOM-baam:

  • parent()
  • parents()
  • parentsUntil()

jQuery parent() methode

De parent() methode retourneert de directe ouder van het geselecteerde element.

Deze methode volgt alleen de DOM-baum een niveau op.

De volgende voorbeeld retourneert de directe ouder van elk <span> element:

Voorbeeld

$(document).ready(function(){
  $("span").parent();
);

Probeer het zelf uit

jQuery parents() methode

De parents() methode retourneert alle ouderlijke elementen van de geselecteerde elementen, het gaat de hele weg naar de wortel van het document (<html>).

De volgende voorbeeld retourneert alle ouderlijke elementen van alle <span> elementen:

Voorbeeld

$(document).ready(function(){
  $("span").parents();
);

Probeer het zelf uit

U kunt ook optionele parameters gebruiken om de zoekopdracht naar ouderlijke elementen te filteren.

De volgende voorbeeld retourneert alle ouderlijke elementen van alle <span> elementen, en het is een <ul> element:

Voorbeeld

$(document).ready(function(){
  $("span").parents("ul");
);

Probeer het zelf uit

jQuery parentsUntil() methode

De parentsUntil() methode retourneert alle ouderlijke elementen tussen twee gegeven elementen.

De volgende voorbeeld retourneert alle ouderlijke elementen tussen <span> en <div> elementen:

Voorbeeld

$(document).ready(function(){
  $("span").parentsUntil("div");
);

Probeer het zelf uit

jQuery doorzoeken referentiemanual

Voor alle jQuery doorzoekmethoden, bezoek onze jQuery doorzoeken referentiemanual.