JQuery siblings(), next(), nextAll(), nextUntil(), prev(), prevAll(), prevUntil() Kullanımı

Merhaba Arkadaşlar,
Bu makalede siblings(), netx(), nextAll(), nextUntil(), prev(), prevAll() ve prevUntil() metodlarını öğreneceğiz.Bildiğiniz gibi Html sayfaları bir ağaç yapısı şeklindedir.İç içe etiketlerden oluşur.En basit haliyle örnek verecek olursak Html sayfalarının yapısı şu şekilde,

Gördüğünüz gibi en başta html etiketi, onun içerisinde ise head ve body etiketleri var. Head etiketi içerisinde de title etiketi vs..İşte JQuery bize bunun gibi iç içe etiketleri seçip işlem yapmamızı kolaylaştıran metodlar sunuyor.Şimdi bu metodların ne işe yaradığını anlatıp, uygulama üzerinde nasıl kullanabileceğimize bakalım.

► siblings() metodu, kardeş etikeleri seçmemizi sağlar.Yani iç içe değilde aynı hizada olan etiketleri diyebiliriz.Örneğin <html></html> etiketi içerisindeki <head> ve <body> etiketleri kardeş etiketlerdir.

► next() metodu, seçmiş olduğumuz bir etiketten sonra gelen ilk kardeş etiketi seçer.

► nextAll() metodu, seçmiş olduğumuz bir etiketten sonra gelen tüm kardeş etiketleri seçer.

► nextUntil() metodu, seçmiş olduğumuz bir etiketten sonra gelen tüm kardeş etiketlerden belirttiğimiz etikete kadar olanları seçer.

► prev() metodu, seçmiş olduğumuz bir etiketten önce gelen ilk kardeş etiketi seçer.

► prevAll() metodu, seçmiş olduğumuz bir etiketten önce gelen tüm kardeş etiketleri seçer.

► prevUntil() metodu, seçmiş olduğumuz bir etiketten önce gelen tüm kardeş etiketlerden belirttiğimiz etikete kadar olanları seçer.

Şimdi teoride kalan bilgilerimizi uygulamaya dökelim.Şu şekilde html kodları tanımlayıp üzerinde metodlarımızı uygulayalım.

Butonlara tıklayarak, kullandığımız metodların seçmiş olduğu etiketlere kenarlık değeri vererek daha görünür olmasını sağlayalım.Örnekleri incelediğinizde daha anlaşılır olacaktır.Kodlarımız şu şekilde;

Yeni bir makalede görüşmek üzere.

Önceki : JQuery Dersleri 17 – parent(), parents(), parentsUntil(), children(), find() Kullanımı

Sonraki : JQuery Dersleri 19 – filter(), eq() Kullanımı

Leave a Reply

TASARIMLARINIZDA KULLANABİLECEĞİNİZ TAM 150 FARKLI RENK PALETİRenkleri Göster
+ +