Metoda closest() v JavaScriptu se uporablja za pridobitev najbližjega prednika ali nadrejenega elementa, ki se ujema z izbirniki. Če prednik ni najden, se metoda vrne nič .
Ta metoda prečka element in njegove starše v drevesu dokumenta in prečkanje se nadaljuje, dokler se ne najde prvo vozlišče, ki se ujema s podanim izbirnim nizom.
Sintaksa
targetElement.closest(selectors);
V zgornji sintaksi je selektorji je niz, ki vsebuje izbirnik (npr p: lebdi itd.), ki se uporablja za iskanje vozlišča.
Razumejmo to metodo z uporabo nekaj ilustracij.
Primer1
V tem primeru so trije elementi div in naslov, na katerega uporabljamo najbližje() metoda. Tu so izbirniki, ki jih uporabljamo id selektor, potomec selektor, otrok selektor, in :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('div3'); var o1 = val1.closest('#div1'); var o2 = val1.closest('div div'); var o3 = val1.closest('div > div'); var o4 = val1.closest(':not(#div3)'); console.log(o1); console.log(o2); console.log(o3); console.log(o4);Preizkusite zdaj
Izhod
Po izvedbi zgornje kode bo rezultat -
Primer2
To je še en primer uporabe JavaScript 's najbližje() 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('p2'); var o1 = val1.closest('p'); var o2 = val1.closest('h3'); var o3 = val1.closest('div'); console.log(o1); console.log(o2); console.log(o3);Preizkusite zdaj
Izhod
Po izvedbi zgornje kode bo rezultat -