# 15: Zincirleme - CSS Hileleri

Anonim

Şimdi birkaç kez jQuery API'sindeki gerçekten oldukça hoş olan küçük dokunuşlardan bahsettik. Her şey iyi düşünülmüş ve rafine edilmiştir. Zincirleme kesinlikle bu kategoriye girer. Kullanmaya başladığınızda ve anladığınızda, başka yolu olmaması gerektiği gibi son derece doğal geliyor.

Ana fikir, tek bir öğe koleksiyonunda arka arkaya birden çok yöntem kullanmanızdır.

Örneğin, bir butona tıkladıktan sonra bir sınıfı değiştirmek ve bazı metinleri değiştirmek istediğimi varsayalım. Ancak düğmenin içinde biraz HTML var.

 Open 

JQuery ile, tüm eylem dizilerini birlikte "zincirleyebiliriz".

$(".button") .removeClass("open") .addClass("closed") .find(".text") .text("Closed");

Bu mümkündür çünkü jQuery'nin yöntemlerinin çoğu, ayarlayıcı olarak kullanılırken, yöntemin çağrıldığı gibi bir öğe kümesi döndürür. Bazen bu küme tam olarak aynıdır, burada removeClassve addClassburada olduğu gibi ve bazen bu küme burada olduğu gibi değiştirilir find.

Videoda çalıştığımız örnekte .end(), zincirde hangi seviyenin "geri adım attığı" hakkında da konuştuk .

$(".button") .removeClass("open") // .button .addClass("closed") // .button .find(".text") // .button .text .text("Closed") // .button .text .end(); // .button .data("thing"); // GETTER on .button

Belki bu onu daha iyi açıklar. Eleman kümesi değiştiğinde, birinci satırı girintili yaptım ve yorumdaki değişikliği not ettim. Sonra .end()bir seviye geri gittiğimizde . Bu, seçimi kaç kez değiştirirseniz değiştirin çalışır. Bir öğe kümesinden başka bir şey döndüren bir yöntem kullandığınızda her şey biter.