jQuery :only-child Seçicisi

:only-child Seçicisi;

Elementin tek çocuğu olan her elementi seçmek için kullanılır.

Örnek

$("li:only-child").css("background-color", "red");

Codepen Ön izleme

Kullanım şekilleri;

$(“:only-child”)

jQuery :odd Seçicisi

:odd Seçicisi;

index numarası tek olan elementleri seçmek için kullanılır. 1,3,5 gibi . index numaraları 0’dan başlar.

Örnek

$("li:odd").css("background-color", "red");

Codepen Ön izleme

Kullanım şekilleri;

$(“:odd”)

jQuery :nth-of-type() Seçicisi

:nth-of-type() Seçicisi;

N’ inci çocuk olan tüm elementleri seçmek için kullanılır.

Örnek

 $("li:nth-of-type(2)").css("background-color", "red");

Codepen Ön izleme

Kullanım şekilleri;

:nth-of-type(n|even|odd|formula)

jQuery :nth-last-of-type() Seçicisi

:nth-last-of-type() Seçicisi;

N sayma sayısından başlar başa doğru devam eder. Yani sondan seçicide denilebilir.

Örnek

<iframe height='268' scrolling='no' src='//codepen.io/w3tr/embed/WwjpXX/?height=268&theme-id=19659&default-tab=result' frameborder='no' allowtransparency='true' allowfullscreen='true' style='width: 100%;'>See the Pen <a href='http://codepen.io/w3tr/pen/WwjpXX/'>jQuery :nth-last-of-type() Seçicisi</a> by W3TR (<a href='http://codepen.io/w3tr'>@w3tr</a>) on <a href='http://codepen.io'>CodePen</a>.
</iframe>

Codepen Ön izleme

Kullanım şekilleri;

 

jQuery :nth-last-child() Seçicisi

:nth-last-child() Seçicisi;

Bu fonksiyon css deki nth fonksiyonundan türetilmiştir. Eşleşen elementlere ait bütün belirtilen son elementleri seçer. Örnek vermek gerekilirse $(“ul li:nth-last-child(2)”) burada bütün ul içindeki li’lerin sondan 2. sini seçer.

Örnek

$("li:nth-last-child(2)").css("background-color", "red");

Codepen Ön izleme

Kullanım şekilleri;

:nth-last-child(n|even|odd|formula)

jQuery :nth-child() Seçicisi

:nth-child() Seçicisi;

Kendi ebevy türü ne olursa olsun nth çocuk tüm elementleri seçmek için kullanılır.

Örnek

 

$("p:nth-child(2)").css("background-color", "red");

Codepen Ön izleme

Kullanım şekilleri;

:nth-child(n|even|odd|formula)

jQuery :not() Seçicisi

:not() Seçicisi;

Belirtilen element dışındaki tüm elementleri seçmek için kullanılır.

Örnek

$("p:not(.w3tr)").css("background-color", "red");

Codepen Ön izleme

Kullanım şekilleri;

$(“:not(selector)”)

jQuery Çoklu Element Seçicisi

Çoklu Element Seçicisi;

Aynı anda birden fazla element seçmek için kullanılır.

Örnek

$("h3, div, p").css("background-color", "red");

Codepen Ön izleme

Kullanım şekilleri;

$(“element1,element2,element3,…“)

jQuery :lt() Seçicisi

:lt() Seçicisi;

Belirtilen sayıdan daha küçük indeks numarasına sahip elementleri seçmek için kullanılır.

Örnek

$("li:lt(2)").css("background-color", "red");

Codepen Ön izleme

Kullanım şekilleri;

$(“:lt(index)”)

jQuery :last Seçicisi

:last Seçicisi;

Eşleşen son elementi seçmek için kullanılır.

Örnek

<iframe height='268' scrolling='no' src='//codepen.io/w3tr/embed/wGJVGJ/?height=268&theme-id=19659&default-tab=result' frameborder='no' allowtransparency='true' allowfullscreen='true' style='width: 100%;'>See the Pen <a href='http://codepen.io/w3tr/pen/wGJVGJ/'>wGJVGJ</a> by W3TR (<a href='http://codepen.io/w3tr'>@w3tr</a>) on <a href='http://codepen.io'>CodePen</a>.
</iframe>

Codepen Ön izleme

Kullanım şekilleri;

$(“:last”)