jQuery ouers() Metode

❮ jQuery deurkruismetodes

Voorbeeld

Gee alle voorouerelemente van <span> terug:

$(document).ready(function(){
  $("span").parents().css({"color": "red", "border": "2px solid red"});
});

Resultaat:

body (great-great-grandparent)
div (great-grandparent)
    ul (grandparent)
  • li (direct parent) span

Definisie en gebruik

Die ouers() metode gee alle voorouerelemente van die geselekteerde element terug.

'n Voorvader is 'n ouer, grootouer, oupagrootjie, ensovoorts.

Die DOM-boom: Hierdie metode beweeg opwaarts vanaf die ouerelement langs voorouers van DOM-elemente, tot by die dokument se wortelelement (<html>).

Let wel: As die filterparameter leeg is, sal hierdie funksie alle voorouers van 'n stel elemente kies, van die direkte ouer en tot by <body> en <html>. Dit is dus dikwels nuttig om 'n kieseruitdrukking deur te gee om die soekresultaat te verklein.

Hierdie metode is soortgelyk aan closest() , deurdat hulle albei deur die DOM-boom beweeg. Die verskille is soos volg:

ouers()

  • Begin met die ouerelement
  • Reis op in die DOM-boom en gee alle voorouers terug wat by die geslaagde uitdrukking pas
  • Die teruggekeerde jQuery-objek bevat nul of meer as een element

naaste ()

  • Begin met die huidige element
  • Reis op die DOM-boom en gee die eerste voorouer terug wat by die geslaagde uitdrukking pas
  • Die teruggekeerde jQuery-objek bevat nul of een element

Ander verwante metodes:

  • parent() - gee die direkte ouerelement van die geselekteerde element terug
  • ouersUntil() - gee alle voorouerelemente terug tussen twee gegewe argumente


Sintaksis

$(selector).parents(filter)

Parameter Description
filter Optional. Specifies a selector expression to narrow down the search for ancestors

Note: To return multiple ancestors, separate each expression with a comma.

Probeer dit self - voorbeelde


Hoe om die filterparameter te gebruik om alle voorouers van <span> wat <ul>-elemente is, terug te gee.


Hoe om die filterparameter te gebruik om alle voorouers van <span> wat <li> en <div> elemente is, terug te gee.


'n Demonstrasie wat wys wie die voorouers van 'n <span> element werklik is.


❮ jQuery deurkruismetodes