jQuery Temelleri - Bölüm 3

Merhaba arkadaşlar jQuery Temelleri makalelerimizin 3. kısmına geçiyorum.

İlk iki makale ye şu linklerden erişebilirsiniz.

Bölüm 1http://www.kodstrap.com/makale-jquery-temelleri-bolum-1-31

Bölüm2  http://www.kodstrap.com/makale-jquery-temelleri-bolum-2-32

Class ekleme / çıkarma

.addClass() - Seçili elemente class eklemeye yarar

   $( 'a' ).addClass( 'kodstrap' ); //kodstrap classını ekledik.

.removeClass() - Seçili elementen class çıkarmaya yarar.

    $( 'a' ).removeClass( 'kodstrap' );//kodstrap classını kaldırdık.

Eğer ekleme çıkarma işlemini ardarda yapırsak .toogleClass() methodunu kullanabiliriz.

  $( 'a' ).toogleClass( 'kodstrap' );//kodstrap classını kaldırdık.

Stil Değiştirme

.css() - methoduyla seçili elementlerin css bilgilerini değiştirebiliriz.

//font-size ve margin-left css stilini değiştirdik.

$( 'a' ).css({

  'font-size': '20px',

  'margin-left': '20px'

});

Form elementlerinin değerlerini değiştirme
.val() - Bu method ile seçili input elementlerinin değerlerini alabilir ve değer atayabiliriz.
//Tipi text olan input olan elementleri seçip değerlerini kodstrap yaptık.
$( 'input[type="text"]' ).val( 'kodstrap' );
Not: type="text" kısmında text yerine diğer html elementlerin tiplerini yazabilirsiniz.
.text() - Bu method seçili elementlerin text özelliklerini alabilir ve ya yazı yazabiliriz.
//Sitedeki tüm div'lere Bir değer yazdık :)
$( 'div' ).text('Bir değer :)');
.html() - Bu method ile seçili elementlerin içine başka elementler eklememize ya da seçili elementlerin html değerlerini almaya yarar.
//Sitedeki tüm divlerin içine <p>İçinde p olan bir div<p> yazdırdık.
$('div').html('<p>İçinde p olan bir div<p>');
Elementlerin niteliklerini seçip değiştirme
Örneğin aşağıdaki kodta formdaki tüm resimlerin title nitelilklerini jQuery Kodstrap olarak değiştir.
$( 'img' ).attr( 'title', 'jQuery Kodstrap' );
//Aşağıdada kodstrap class'ına sahip elementi id niteliğini aldık.
var idsi = $(".kodstrap").attr("id");
4. makale de görüşmek üzere. İyi Kodlar!