logo

JavaScript closest()

Closest() metoda u JavaScriptu koristi se za dohvaćanje najbližeg pretka, ili roditelj elementa odgovara selektorima. Ako nema pronađenog pretka, metoda se vraća ništavan .

Ova metoda prelazi element i njegove roditelje u stablu dokumenta, a obilazak se nastavlja sve dok se ne pronađe prvi čvor koji odgovara navedenom nizu selektora.

Sintaksa

 targetElement.closest(selectors); 

U gornjoj sintaksi, selektori je niz koji sadrži selektor (kao p: lebdjeti , itd.) koristi se za pronalaženje čvora.

Razumimo ovu metodu koristeći neke ilustracije.

Primjer1

U ovom primjeru postoje tri div elementa i naslov na koji primjenjujemo najbliži() metoda. Ovdje su selektori koje koristimo iskaznica selektor, potomak selektor, dijete selektor, i :ne selektor.

 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); 
Testirajte sada

Izlaz

Nakon izvršenja gornjeg koda, izlaz će biti -

JavaScript closest()

Primjer2

Ovo je još jedan primjer korištenja JavaScript 's najbliži() metoda.

 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); 
Testirajte sada

Izlaz

Nakon izvršenja gornjeg koda, izlaz će biti -

JavaScript closest()