Üye Kayıt Üye Giriş

jQuery Bulma Fonksiyonları


jQuery Bulma Fonksiyonları

 

 

.add()

.children()

.find()

.parent()

.next()

.nextAll()

.prev()

.prevAll()

 

.add()      -> Seçmiş olduğumuz nesnelere yeni bir seçim ekler.

 

 

1
$('div').css('color','red');   // Normalde div'i seçtik ve yazı rengini kırmızı yaptık.

 

 

1
$('div').css('color','red').add('span').css('background-color','black');

 

 

1
2
3
<div class='yazi'>Bu yazıdır.</div>
 
<span>Span İçeriği.</span>

 

Normalde ilk kodumuzda sadece div‘i seçmiştik. Ve bu seçime göre de yazı rengini kırmızı yaptık.

2. Kodumuzda ise seçmiş olduğumuz div‘e ek olarak birde span seçtik(span ekledik.)

Artık yeni seçimimiz div ve span oldu. Bu seçime göre arka planını siyah yaptık. Yani artık div ve span’ın arka planı siyah oldu.

 

.children()  -> Bir nesnenin altındaki nesleri bulmamıza yarar.

 

1
$('span').children().css('color','red') ;

 

Children fonksiyonu ile span içersindeki tüm alt nesneleri seçtik ve rengini kırmızı yaptık. Sadece strong ve em içindeki yazıların rengi kırmızı olacaktır

 

1
<span>Bu yazı span içerisindedir. <strong>bu kısmı kalın </strong>ve <em>bu kısmı eğiktir</em></span>

 

Eğer istersek children() fonksiyonunada seçici tanımlayabiliriz.

 

1
$('span').children('em').css('color','red') ;  // Şimdi ise sadece <em>em</em> tagleri içindeki yazı kırmızı olacaktır.

 

.closest()  ->Seçilen nesne ile closest‘in içine girilen nesne arasındaki tüm block seviye nesneleri seçer.

 

1
$('p').closest('.sol').css('color','red');  

 

En içteki p tagini seçtik ve closest değerine classı sol olan nesneleri girdik. Böylece p ile classı sol olan nesne arasındaki nesneleri seçiyoruz. (p ve .sol dahil).

 

1
2
3
4
5
6
7
<divid="tasiyici"> Taşıyıcı içi
<div class="sol"> Sol içi
<div class="menu"> Menü İçi
<p> Burası Paragraf </p>
</div>
</div>
</div>

 

Sol içi, Menü İçi ve Burası Paragraftır yazılarının rengi kırmızı olacaktır.

 

.find()  -> Bir nesnenin içindeki nesneyi bulmaya yarar.

 

1
$('span').find('strong').css('color','red');   

 

span içersindeki strong nesnesini seçtik ve rengini kırmızı yaptık.

 

1
<span>Bu spanın içinde <strong>kalın yazı</strong> vardır.</span>

 

.parent()  -> Seçilen nesnenin bir üst nesnesini seçer.

 

1
$('strong').parent().css('color','red') ;

 

Strong nesnesinin bir üst nesnesi olan span’ı seçtik ve yazı rengini kırmızı yaptık. Her parent() yazışımızda bir üst nesneye zıplarız.Yani;

 

1
$('strong').parent().parent().css('color','red')  ;

 

Şimdi ise strong nesnesinin bir üst nesnesi olan span‘ında bir üst nesnesi olan div nesnesinin yazı rengini kırmızı yaptık.

 

1
2
3
<div class="menu"> Menü İçi
 <span>Bu spanın içinde <strong>kalın yazı</strong> vardır.</span>
 </div>

 

.next()  -> Seçilen nesneden bir sonraki nesneyi seçmeye yarar.

 

1
$('p').next().css('color','red'); 

 

p nesnesinden bir sonraki nesnenin yazı rengini kırmızı yaptık. Yani <h2> nesnesinin yazı rengi kırmızı oldu.

 

1
2
3
<p> Paragraftır.</p>
 
<h2>h2 etiketli bir başlıktık.</h2>

 

next() fonksiyonuna nesne girersek. Eğer seçilen nesneden sonra o nesne varsa seçer yoksa seçmez.

 

1
$('p').next('span').css('color','red'); 

 

p nesnesinden sonra span nesnesi olmadığı için hiç bir nesnenin rengi değişmedi. Ama p den sonra span olsaydı onun yazı rengini kırmızı yapacaktı.

 

.nextAll() -> Seçilen nesneden sonraki tüm nesneleri seçer ve ona göre işlem yapar.

.prev() -> Next() in tam tersidir. Seçilen nesneden önceki nesneyi seçer.

.prevAll() -> nextAll() un tam tersidir. Seçilen nesneden sonraki tüm nesneleri seçer.

Bunlardan başka bulma(finding) fonksiyonları da vardır. Ama bunlar en önemli olanlarıdır. Jquery sitesinden diğer bulma fonksiyonlarına bakabilirsiniz.

Bilgisayar Dershanesi Ders Sahibi;
Bilgisayar Dershanesi

Yorumlar

Yorum Yapabilmek İçin Üye Girişi Yapmanız Gerekmektedir.

ETİKETLER