JQuery Document Ready Nedir?

Merhaba Arkadaşlar,
Bu yazımızda Jquery’de $(document).ready(function{ }); yapısını neden kullandığımızı öğreneceğiz.Basit bir Html5 sayfası oluşturup içerisine id’si text olan bir <p> etiketi oluşturdum.Jquery kullanabilmek için Google CDN ile projeme Jquery’i ekledim.Şimdi Jquery kullanarak <p> etiketinin css özelliklerinden arkaplan rengini sarı yapacağız.Sayfamızın kodları şu şekilde:

Sayfamızı tarayıcıda görüntüleyelim.

jquery-document-ready-nedir-2

Gördüğünüz gibi <p> etiketinin arkaplan rengi değişmedi.Çünkü sayfa görüntülendiğinde öncelikle head etiketinin içerisi çalışacak.Ve burda id’si text olan p etiketi üzerinde işlem yapmaya çalışıyoruz.<p> etiketi body içerisinde olduğu için henüz yüklenmedi ve bu yüzden ulaşamıyoruz.Tabi arkaplan renginide değiştirememiş olduk.Peki bu problemi nasıl çözeceğiz.İşte Jquery kodlarımızı$(document).ready(function{  //Kodlar buraya yazılacak  }); içerisinde yazdığımız zaman şunu demiş oluyoruz.Burda yazılı kodlar, tüm sayfa yüklendikten sonra çalışsın.Bu şekilde yazdığımız zaman body içerisindeki <p> etiketide yüklenmiş olacağı için yazdığımız jquery kodları etkin olacak.Sayfamızın kodları ve tarayıcıdaki görüntüsü şu şekilde:

jquery-document-ready-nedir-4

Son olarak şunu da söyleyelim.Bunu 2 farklı şekilde kullanabiliriz, tek farkı ikincisinin biraz daha kısa olması.Hangisini kullanmak isterseniz onu kullanabilirsiniz.

Yeni bir makalede görüşmek üzere.

Önceki : JQuery Dersleri 1 – JQuery Nedir ve Nasıl Kullanılır?

Sonraki : JQuery Dersleri 3 – Seçiciler

Leave a Reply

TASARIMLARINIZDA KULLANABİLECEĞİNİZ TAM 150 FARKLI RENK PALETİRenkleri Göster
+ +