JAVASCRIPT DICHTSTBIJZIJNDE()

De methode closer() in JavaScript wordt gebruikt om de dichtstbijzijnde voorouder of ouder van het element op te halen die overeenkomt met de selectors. Als er geen voorouder wordt gevonden, retourneert de methode nul .

Deze methode doorloopt het element en zijn ouders in de documentboom, en het doorlopen gaat door totdat het eerste knooppunt wordt gevonden dat overeenkomt met de opgegeven selectorstring.

Syntaxis

 targetElement.closest(selectors);

In de bovenstaande syntaxis, selectoren is een string die een selector bevat (zoals p: zweven , etc.) gebruikt om een knooppunt te vinden.

wie is urfi javed

Laten we deze methode begrijpen aan de hand van enkele illustraties.

begint met Java

Voorbeeld 1

In dit voorbeeld zijn er drie div-elementen en een kop waarop we de dichtstbijzijnde() methode. Hier zijn de selectors die we gebruiken de ID kaart keuzeschakelaar, afstammeling keuzeschakelaar, kind keuzeschakelaar, en :niet keuzeschakelaar.

 This is the first div element. <h3 id="h"> This is a heading inside the div. </h3> This is the div inside the div element. This is the div element inside the second div element. var val1 = document.getElementById(&apos;div3&apos;); var o1 = val1.closest(&apos;#div1&apos;); var o2 = val1.closest(&apos;div div&apos;); var o3 = val1.closest(&apos;div &gt; div&apos;); var o4 = val1.closest(&apos;:not(#div3)&apos;); console.log(o1); console.log(o2); console.log(o3); console.log(o4);

Test het nu

Uitvoer

Na de uitvoering van de bovenstaande code zal de uitvoer zijn:

Voorbeeld2

Dit is nog een voorbeeld van gebruik JavaScript 'S dichtstbijzijnde() methode.

 This is the div element. <p id="p1"> This is the paragraph element inside the div element. </p><h3 id="h"> This is the child of the paragraph element. <p id="p2"> This is the child of heading element of the paragraph element. </p> </h3> <p></p> var val1 = document.getElementById(&apos;p2&apos;); var o1 = val1.closest(&apos;p&apos;); var o2 = val1.closest(&apos;h3&apos;); var o3 = val1.closest(&apos;div&apos;); console.log(o1); console.log(o2); console.log(o3);