jQuery Zincirleme Metot Kullanımı

jQuery ile bir metot ya da olaya birden fazla işlem yaptırabiliriz. Bu işlemleri peşpeşe tanımlama işlemine chaining yani zincirleme denir.

Zincirleme tek bir ifade için birden fazla jQuery işlemini gerçekleştirme olayıdır.

jQuery Metot Zincirleme

Şimdiye kadar jQuery metotlarını tek tek yani birbiri ardına yazıyorduk. Ancak aynı eleman üzerinde birden fazla jQuery işlemini çalıştırmamıza izin veren zincirleme adında bir teknik bulunmaktadır.

Zincirleme metodu sayesinde tarayıcıların aynı elementi birden fazla kere bulmasına gerek kalmaz.

Zincirleme metotlar şu şekilde yazılır.

$(secici).birinciIslem().ikinciIslem(). ...

Hemen bir örnekle göstermek istiyorum.

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
  $("button").click(function(){
    $("#p1").css("color", "green").slideUp(500).slideDown(500);
  });
});
</script>
</head>
<body>
<p id="p1">jQuery çok güzel!!</p>
<button>Tıkla Bana</button>
</body>
</html>

Yukarıdaki kodda Tıkla bana adlı butona tıkladığımızda p1 id'li elementin içerisindeki yazı yeşil renge döner ve 0.5 saniye içinde kapılıp açılır.

$("#p1").css("color", "green").slideUp(500).slideDown(500);

Asıl olay bu satırda gerçekleşir. ( . ) ile birbirine bağlanan metotlar sırayla çalışmaya başlar. Eğer isteseydikdaha fazla jQuery fonksiyonu da ekleyebilirdik.

Zincirleme yaparken kod satırı oldukça uzun olabilir. Ancak, jQuery sözdizimi konusunda çok katı değildir; satır sonları ve girintiler dahil olmak üzere istediğiniz gibi biçimlendirebilirsiniz. Kullanılması tavsiye edilen sözdizimi şekli;

$("#p1").css("color""red")
  .slideUp(2000)
  .slideDown(2000);


YAZAR HAKKINDA

26 Yaşında. Araştırmayı seven, bir şeyler öğretmeye meraklı bir Bilgisayar Mühendisi

0 YORUM

Bu konuya henüz yorum yapılmamış

Yorum Yap

@COPYRIGHT KodlamakLazım Tüm Hakları Saklıdır.