jQuery Temelleri - Bölüm 1

Merhaba arkadaşlar bu makalemde jQuery'nin temellerinden bahsedeceğim. Hiç klasik bir giriş yapmıyorum. Direk olaya giriyorum :)

$ Nedir?

" $ " jQuery'nin html elementlerini seçmemize yarayan işaretidir.
Örneğin bir listenin elemanları seçmek ve üzerinde işlem yapmak için.
var liste = $("li");
Bu şekilde html form'daki tüm li etiketleri seçilir ve üzerinde işlem yapabiliriz.

$(document).ready()

Document Ready. Açılan sayfa tamamen yüklediğinde yapılacak işlemleri bu method içinde kullanırız. Örneğin:
$(document).ready(
function(){  //Sayfa yüklediğinde bu method çalışır.
alert("Sayfa Yüklendi");
});

Seçili element örnekleri


$( '#makale' ); // makale id'sine sahip elementi seçer.
$( 'li' );      // sayfadaki tüm liste elementlerini seçer
$( 'ul li' );   // sayfadaki tüm sırasız liste elementlerini seçer.
$( '.kodstrap' ); // kodstrap class'ına sahip tüm elementlerini seçer.

Elementi doğru seçtik mi?


Bir elementi seçip seçemediğimiz anlayabilmek için jquery'nin length methodunu kullanıyoruz..
if ( $( '#secilielement' ).length > 0 ) {
// Bir şeyler yaz.. 
}
Bu if kullanımı seçimin doğru olup olmadığını döndürür bize...

Seçilen bir grup element içinden herhangi birini seçmek.


var liste= $('ul#liste li' );
var indextekielement= liste[0];
Bunu dizi gibi düşünebiliriz. liste dizisinin 0. ncı index'indeki element.

Seçili elementin içini doldurmak.


$( 'table tr td' ).html( '<div>jQuery is aWesome!</div>' );  
Bu kod parçacığında sayfadaki table'lar içindeki tüm td'lerin html'ine <div>jQuery is aWesome!</div> yazacaktır.
Sadece text yazdırmak istiyorsak text() methodunu kullanıyoruz.
$( 'table tr td' ).text( 'jQuery is aWesome!' ); 
Makalenin devamını bekleyin. :)
İyi Kodlar!

Kaynak : http://www.kodstrap.com/makale-jquery-temelleri-bolum-1-31

Yorumlar