JavaScript'teki en yakın() yöntemi, en yakın atayı almak için kullanılır veya öğenin ebeveyni seçicilerle eşleşir. Ata bulunamazsa yöntem şunu döndürür: hükümsüz .
Bu yöntem, belge ağacındaki öğeyi ve onun üst öğelerini dolaşır ve çapraz geçiş, sağlanan seçici dizeyle eşleşen ilk düğüm bulunana kadar devam eder.
Sözdizimi
targetElement.closest(selectors);
Yukarıdaki sözdiziminde, seçiciler bir seçici içeren bir dizedir (gibi s: üzerine gelin , vb.) bir düğüm bulmak için kullanılır.
Bazı çizimler kullanarak bu yöntemi anlayalım.
Örnek 1
Bu örnekte üç div elemanı ve üzerine uyguladığımız bir başlık var. en yakın() yöntem. Burada kullandığımız seçiciler şunlardır: İD seçici, azalan seçici, çocuk seçici ve :Olumsuz seçici.
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);Şimdi Test Edin
Çıktı
bash else if
Yukarıdaki kodun yürütülmesinden sonra çıktı şu şekilde olacaktır:
Örnek2
Bu, kullanmanın başka bir örneğidir JavaScript 'S en yakın() yöntem.
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);Şimdi Test Edin
Çıktı
Yukarıdaki kodun yürütülmesinden sonra çıktı şu şekilde olacaktır:
