jQuery türkiye!: jQuery .length kullanımı

Bu yazımızda jQuery ile .length fonksiyonunu kullanacağız. Bu fonksiyon sayesinde belirttiğimiz Id/Etiket/Tag gibi nesnelerin sayılarının toplamını bulabiliriz. Şimdi alt tarafta bi örnek vereceğim ve verdiğim bu örnekte her tıklamada bir adet div nesnesi oluşturup toplam div sayısınıda ekrana yazdıracağım. Hemen örnek uygulamaya geçiyor ve konuya çözümlüyoruz.

<!DOCTYPE html>
<html>
<head>
  <style>
   body { cursor:pointer; }
   div { width:50px; height:30px; margin:5px;

float:left; background:red; }
   span { color:red; }
  </style>
  <script src="http://code.jquery.com/jquery-1.4.4.js"></script>
</head>
<body>
  <span></span>
  <div></div>
<script>
 $(document.body).click
 (
 function ()
  {
   $(document.body).append($("<div>"));
   var kutuSayisi = $("div").length;
   $("span").text("Toplam kutu sayisi "+ kutuSayisi +" TIKLA");
  }
 ).trigger('click');
</script>
 
</body>
</html>

Aklınıza takılan bölümler var ise aşağıdaki kısım ile açıklama yapalım. Belki bu konuda biraz ecemisinizdir ve konuyu iyice anlatayım.

<style>
  body { cursor:pointer; }
  div { width:50px; height:30px; margin:5px;

float:left; background:red; }
  span { color:red; }
</style>

Yukarıdaki kod parçası ile div'mizin stilini belirlemiş olduk. Yani kırmızı renkte olmasını ve div kutusunun boyutunu belirttik.

<script>
 $(document.body).click
 (
 function ()
  {
   $(document.body).append($("<div>"));
   var kutuSayisi = $("div").length;
   $("span").text("Toplam kutu sayisi "+ kutuSayisi +" TIKLA");
  }
 ).trigger('click');
</script>

Yukarıdaki kod parçasına bakalım. var kutuSayisi kısmına bakın, div nesnesinin .lenght'ini alıyoruz. Span etiketlerinin içinde "Toplam kutusu x TIKLA" yazısını yazdırıyoruz.

Konu hakkındaki soru ve sorunlarınız için coderler sitesinde jQuery .length kullanımı bölümüne alalım. Bu yazı Mustafa Tanrıverdi tarafından yazılmıştır.

jQuery türkiye!

Sayfalar

jQuery .length kullanımı

Hiç yorum yok:

Yorum Gönder