Jquery eğitim serimize devam ediyoruz.Bu derste seçicileri göreceğiz.Öncelikle seçici ne işe yarar ona bakalım.
Seçiciler sayfada bulunan html elemanlarına ulaşmamız gereken yoldur.Daha önce css dersinde de anlatmıştım.Css teki seçiciler bunda da aynı.
http://ustaderslik.com/konu/CSS_Ders-1_Giri%C5%9F_ve_Se%C3%A7iciler
Classlara erişmek için kodumuz şu :
$(".class_ismi")
Bu class a göre erişim yapmamızı sağlıyor.
İdlere erişmek için kodumuz şu :
$("#id_ismi")
Bu id e göre erişim yapmamızı sağlıyor.
Taglara erişmek için kodumuz şu :
$("tag_ismi")
Bu tag a göre erişim yapmamızı sağlıyor.Yani a yazarsak tüm a lara div yazarsak tüm divlere erişiriz.
Parametrelere erişmek için kodumuz şu :
$("#id_ismi[name=isim]")
Bu parametre değerine göre erişim yapmamızı sağlıyor.Yani [name=cArleone] yada [id=cArleone] ... bu şekilde atanan parametrenin değeri şu ise işlem yapıyoruz.
Tüm taglara erişmek için kodumuz şu :
$("*")
Bir objenin alt nesnesine erişmek için kodumuz şu :
$("#id_ismi span")
Bu şu objenin içindeki şu objeyi seç demek için.Örnek div span diyerek divlerin içindeki spanlara erişebiliriz.
En temel seçicilerimiz bunlar.Şimdi örnek olarak görelim.
$(".logo") //class ı logo olanı seçer
$("#logo") //id i logo olanı seçer
$("img") //tüm resimleri seçer
$("img [id=logo]") //resimlerden id i logo olanı seçer
$("*") //tüm tagları seçer
$(".logo #yazi")//class ı logo olanın içindeki id i yazı olanı seçer
Bu şekilde taglarımıza erişiyoruz.Gerisi jquery kodları ile bunlara işlem yapmak kalıyo.Örnek bir işlem göstereyim.Diğer derslerde kodları anlatağım.
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>cArleone</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script type="text/javascript">
$(function(){
var isim=$(".alan").html();
alert(isim)
})
</script>
</head>
<body>
<div class="alan">cArleone</div>
</body>
</html>
.alan erişip html metodu ile içeriğini aldım isim değişkenine aktarıp alert ile uyarı verdirdim.Basit bir örnek.
UstaDerslik
