jQuery parent() , parents() , parentsUntil() ve children()

Merhaba dostlar, bu dersimizin konusu jQuery   parent() , parents() , parentsuntil() ve children() metodlarıdır. Biliyorsunuz ki Html bir web sayfamızda element içerisinde element vardır.

Örneğin bir div elementi içerisinde birden fazla div yada li gibi elementlerin olması gibi. Şimdi öğreneceğimiz metodlar ise seçtiğimiz bir Html elementinin üst kısmında yada o elementin içerisinde yer alan html elementlerini bulmamızda kullanılacak. şimdi hiç vakit kaybetmeden ilk metodumuz olan parent() ile başlayalım.

jQuery parent()

jQuery parent() metodumuz seçilen bir Html elementinin bir üstünde bulunan Html etiketini Bulur. Şimdi örnek ile ne işe yaradığını kavrayalım.

Örneğimizde görüldüğü gibi span elementini seçtik. Peki span hangi elementin içerisinde ? bunu parent() metodumuz sayesinde bulduk. Örneğimize göre li elementi kırmızıya dönüşecektir.

jQuery parents()

jQuery parents() metodu seçilen bir Html elementinin üstünde yer alan tüm elementleri seçer. Şimdi örneğimizi inceleyerek daha iyi kavrayalım.

Evet yukarıdaki örneğimizde görüldüğü gibi jQuery ile seçilen bir Html elementinin parents() metodu ile üzerinde yer alan tüm Html elementlerini seçtik.

jQuery parentsUntil()

jQuery parentsUntil() metodumuz ise seçilen bir Html elementinin belirttiğimiz bir üst Html elementi arasında kalan tüm elementleri seçer. örneğimizi inceleyelim.

Canlı örneğimizde görüldüğü gibi span elementi ile div elementi arasında kalan tüm elementler parentuntil() metodumuz ile seçildi ve kırmızıya dönüştü.

jQuery children()

jQuery children() metodumuz ise seçilen bir Html elementinin içersin de yer alan elementi seçer. Ama seçilen elementin içerisinde başka bir Html elementi varsa seçmez. Örneğimiz ile daha kolay kavrayalım.

Yukarıdaki örneğimizde div elementi içerisinde yer alan tüm p elementlerini seçti. Peki buna koşul bağlayabilir miyiz ? Evet. Aşağıdaki örneğimizi inceleyelim.

Yukarıda div elementi içerisinde ki çocuk elementlerini seçmesini istedik, ama bir koşul belirttik class değeri first olan p elementine kadar seçmesini istedik.

Bu dersimizde bu kadar dostlar. Diğer bir derste görüşmek üzere.

Bir cevap yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir

Shares