Hoe vind je een ouder met een bekende klas in jQuery?

Ik heb een <div>die vele andere <div>en bevat, elk op een ander nesting-niveau. In plaats van elk kind <div>een identifier te geven, geef ik liever gewoon de root <div>de identifier. Hier is een voorbeeld:

<div class="a" id="a5">
  <div class="b">
    <div class="c">
      <a class="d">
      </a>
    </div>
  </div>
</div>

Als ik een functie in jQuery schrijf om te reageren op klasse den ik wil de ID vinden voor zijn ouder, klasse a, hoe moet ik dat dan doen?

Ik kan niet zomaar $('.a').attr('id');doen, omdat er meerdere klasse as zijn. Ik kon de ouder-ID van de ouder van de ouder vinden, maar dat lijkt een slecht ontwerp, traag en niet erg polymorf (ik zou andere code moeten schrijven om de ID voor klasse cte vinden).


Antwoord 1, autoriteit 100%

Ervan uitgaande dat this.dis, kun je schrijven

$(this).closest('.a');

De closestmethoderetourneert de binnenste ouder van je element dat overeenkomt met de kiezer.


Antwoord 2, autoriteit 6%

Geef een selector door aan de jQuery ouders-functie:

d.parents('.a').attr('id')

EDITHmm, eigenlijk is het antwoord van Slaks superieur als je alleen de dichtstbijzijnde voorouder wilt die overeenkomt met je selector.


Antwoord 3, autoriteit 2%

U kunt ouders()gebruiken om alle ouders met de gegeven selector te krijgen.

Beschrijving: verkrijg de voorouders van elk
element in de huidige set van overeenkomende
elementen, optioneel gefilterd door a
kiezer.

Maar parent()krijgt alleen de eerste parent van het element.

Beschrijving: verkrijg de ouder van elk
element in de huidige set van overeenkomende
elementen, optioneel gefilterd door a
kiezer.

jQuery parent() versus ouders()

En er is .parentsUntil()waarvan ik denk dat dit het beste zal zijn.

Beschrijving: verkrijg de voorouders van elk
element in de huidige set van overeenkomende
elementen, tot maar niet met inbegrip van de
element dat overeenkomt met de selector.


Antwoord 4

Geëxtraheerd uit de opmerkingen van @Resord hierboven. Deze werkte voor mij en was meer geneigd met de vraag.

$(this).parent().closest('.a');

Bedankt


Antwoord 5

Gebruik .parentsUntil()

$(".d").parentsUntil(".a");

Antwoord 6

<div id="412412412" class="input-group date">
     <div class="input-group-prepend">
          <button class="btn btn-danger" type="button">Button Click</button>
          <input type="text" class="form-control" value="">
      </div>
</div>

In mijn situatie gebruik ik deze code:

$(this).parent().closest('.date').attr('id')

Ik hoop dat dit iemand helpt.

Other episodes