JAVASCRIPT CLOSEST()

Метод closest() у JavaScript використовується для отримання найближчого предка або батьківського елемента, який відповідає селекторам. Якщо предка не знайдено, метод повертається нуль .

if else if else if java

Цей метод обходить елемент і його батьків у дереві документа, і обхід продовжується, доки не буде знайдено перший вузол, який відповідає наданому рядку селектора.

Синтаксис

 targetElement.closest(selectors);

У наведеному вище синтаксисі селектори це рядок, що містить селектор (як p: наведення і т. д.) використовується для пошуку вузла.

Давайте зрозуміємо цей метод за допомогою деяких ілюстрацій.

Приклад1

У цьому прикладі є три елементи div і заголовок, до якого ми застосовуємо найближчий() метод. Тут ми використовуємо селектори id селектор, нащадок селектор, дитина селектор і : ні селектор.

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

Перевірте зараз

Вихід

Після виконання наведеного вище коду результатом буде -

Приклад 2

Це ще один приклад використання JavaScript 's найближчий() метод.

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