En iyi 10 mükemmel Jquery ipucu

Jquery'i artık günümüzde her projede kullanılmaktadır. Bunun için kullanımda yardımcı olan püf noktarını, kullanımları hakkında en yararlı gördüğüm 10 tanesi burda bulunmaktadır. Eklenmek istedikleriniz yorum kısmında yazabilirsiniz.

1. Jquery kütüphanemizi Google'da host etmek: google bize Jquery kütüphanesini kendi hostu üzerinden yüklememizi imkan sağlamaktadır. Bu bize ön belleğe alınan dosyanın daha hızlı yüklenmesini sağlamaktadır.

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript">
 $(document).ready(function() {
    //yazılacak kodlar
 });
</script>

2. HTML içine Jquery den eleman eklemek:

var ekle = $('<div></div>');
ekle.attr("id","uzmanim").appendTo("body");

3. Kolay kullanılan tarayıcıyı yakalama

$.browser.safari 
$.browser.msie
$.browser.mozilla

tarayıcı sürümünü yakalamak için

if ($.browser.msie && $.browser.version <= 7 ) {
// yapılacak işlemler
}

4. Jquery kısaltması: genelde bu şekilde

$(document).ready(function (){ });

kullanılır. Daha kısa şekilde ise aşağıdaki gibi kullanılır.

$(function (){ });

bu daha kolay ve akılda kalıcı bir kullanımdır.

5. Metot Zincirleme özelliği ile daha kısa kodlar üretmek

Bir çok metodu arka arkaya aynı elemana yazmaktansa zincirleme kullanabilme özelliği ile Jquery'de daha kısa kodlar yazabiliriz.

$('div.ilkDiv').css ('color', '#0000ff').text ('uzmanim').addClass ('ilkOrnek').fadeTo (1500,1);

Yukarıdaki örnekte görüldüğü gibi arka arkaya metotları kullanabiliriz. Ancak çok fazla kullanmanın performansı etkilediğini unutmayarak bunu kullanmanızda fayda var.

6. Çok tekrarlanan seçicileri bir değişkene tanımlamak

$('div.ilkDiv').css ('color','#00ff00'); 
$('div.ilkDiv').text ('Örnek 1');
$('div.ilkDiv').addClass ('uzmanim'); 
$('div.ilkDiv').fadeTo (1500,1);

Yukarıdaki gibi bir kullanımda çok fazla tekrarlayan bir seçiciyi bir değişkene atayıp daha ideal bir kod elde edebiliriz.

var $p = $('div.ilkDiv');
$p.css ('color', '#00ff00'); 
$p.text ('Örnek 1'); 
$p.addClass('uzmanim'); 
$p.fadeTo (1500, 1);

Bu kullanım ile eleman ilk başta bir değişkene atanıp ön belleğe alınıyor ve daha hızlı erişilebilmektedir.

7. Zebra tablo yapmak

Tablo okunabilirliğini arttırmak için bir satır farklı bir renk veya stil tanımlarız. Bunu javascript uzun olarak yaparken jquery ile tek satır kod ile yapılabilmektedir.

$("tr:nth-child(odd)").addClass("farklGorunun");

8. Mümkünse Class yerine Id kullanmayı tercih edin

Jquery ile kod yazarken bize çok büyük kolaylıklar kazandırmaktadır. Bunlardan bir tanesi de elemana atanmış sınıfı yardımı ile kolayca seçebilme özelliğidir, ancak burada şöyle bir durum söz konusudur; jquery id ile atanmış elemanları normal javascriptteki gibi getElementById ile yakaladığı için daha hızlı çalışırken normal olarak sınıf ile yakalamalarda daha yavaş çalışacaktır.

Bu nedenle mümkün olduğunca seçicilerde id kullanmaya dikkat edilmelidir.

9. Bir elemanın index değerini bulmak

index değerini bulmanın farklı bir yoludur.

("div > li").click(function () {
    var index = $(this).prevAll().length;
});

10. Jquery Kopya Kağıdı (Cheat Sheet)

Jquery'nini bir çok özelliği var ve bunları aklımızda tutma imkanımız yoktur. Bu kopya kağıdı bu gibi durumlar için işimizi kolaylaştırır.

http://www.futurecolors.ru/jquery/