Jquery ile en çok yaptığım işlemlerden olmalarına rağmen bazen fazlasıyla karmaşıklaşan işlemlerden olmuştur benim için html öğelerinin arasında gezinmek. Ama başka bir öğeye nasıl ulaşacağınızı çözdüğünüz zaman ya da şöyle diyim, html öğelerini birbirlerine göre hızlıca nasıl manipüle edeceğinizi öğrendiğiniz zaman fazlasıyla anlam kazanıyor jquery. Mesela bir "img" öğesine ulaşmak istiyorsunuz, eğer tıkladığınız öğenin direk alt elemanlarından biriyse aradığınız, bunu kullanabilirsiniz. Bu işlemi bir tıklama fonksiyonunu içine yazacağınız için buradaki this, o tıklanan öğenin kendisini kullanır:
jQuery(this).children("img");
Yani eğer tıkladığınız öğenin ID si "mustafa" ise şunu yazabilirsiniz, bu sadece img yi bulur ve obje döndürür ama görüldüğü gibi onunla bir işlem yapmaz:
$('#mustafa').click(function(){
$(this).children("img");
});
Eğer direk bir alt öğe değilse, yani kendi çocuğu değil de çocuğunun çocuğu filan ise, şu şekilde buldurabilirsiniz:
jQuery(this).find("img");
Karşınıza gelen özellikle ilk img yi al demek isterseniz şunları da kullanabilirsiniz, bunların çoğu bir alt öğesini yani direk çocuğunu almak için. Fonksiyon dahilinde sayı şeklinde 0 olanların yerine başka sayı yazarak kaçıncı img yi istediğinizi belirletebilirsiniz:
$($(this).children()[0])
$(this:first-child)
$("#" + this.id + " img:first")
$(this).children("img:first")
$('> .child', this)
$(this).children('img:nth(0)')
Bir öğenin bir üst öğesine ulaşmak ise fazlasıyla net, şöyle ailesini çağırıyoruz:
var aile = $(this).parent()
Kardeşlere ulaşmak ise başınıza iş çıkarabilecek şeylerden, mesela şöyle ailenin çocuklarından bulma işlemi yaptırabilirsiniz, bu abi class/sınıfına sahip öğeyi getirecektir. Ancak dikkat etmelisiniz ki bu şekilde çağırma kullanırken, işlemi başlattığınız öğeyi de çağırmamak için o belirttiğiniz class(abi) a sahip olmamasına dikkat edin ki:
var abi = $(this).parent().children('.abi');
Diğer bir yol da bir sonraki, bir önceki ya da diğer olarak kardeşleri arasındaki öğe diyerek de diğer kardeşe ulaşmak. Bu işlemlerin hepsinde "kardes" sınıfını vermek yerine "img" ya da başka bir öğe adı kullanabilirsiniz ya da tam tersi:
var sonraki = $(this).next('.kardes');
var onceki = $(this).prev('.kardes');
var kardes= $(this).siblings('img');