Už sme niekoľkokrát hovorili o malých dotykoch v rozhraní jQuery API, ktoré sú naozaj celkom pekné. Všetko je dobre zvážené a prepracované. Reťazenie rozhodne patrí do tejto kategórie. Len čo ho začnete používať a pochopíte, cítite sa mimoriadne prirodzene, akoby to nemalo byť inak.
Hlavná myšlienka je, že na jednu kolekciu prvkov použijete viac metód za sebou.
Povedzme napríklad, že po kliknutí na tlačidlo chcem zmeniť triedu a zmeniť aj nejaký text. Ale tlačidlo má vo vnútri nejaký HTML.
Open
Pomocou jQuery môžeme „spojiť“ celú sériu akcií dokopy.
$(".button") .removeClass("open") .addClass("closed") .find(".text") .text("Closed");
Je to možné, pretože väčšina metód jQuery, keď sa používa ako nastavovač, vracia množinu prvkov rovnako ako tá, na ktorú bola metóda vyvolaná. Niekedy je táto množina úplne rovnaká, ako je to v prípade tu removeClass
a addClass
tu, a niekedy je táto množina zmenená, ako je to v tomto prípade find
.
V príklade, s ktorým sme vo videu pracovali, sme hovorili aj o tom, .end()
ktorá „vycúva“ z jednej úrovne reťazca.
$(".button") .removeClass("open") // .button .addClass("closed") // .button .find(".text") // .button .text .text("Closed") // .button .text .end(); // .button .data("thing"); // GETTER on .button
Možno to lepšie vysvetľuje. Keď sa množina prvkov zmení, odsadil som riadok jeden a zmenu som zaznamenal v komentári. Potom, keď .end()
ustúpime späť o jednu úroveň. Toto funguje bez ohľadu na to, koľkokrát zmeníte výber. Všetko sa končí, keď použijete metódu, ktorá vráti niečo iné ako množinu prvkov.