Už jsme několikrát mluvili o drobných dotycích v rozhraní jQuery API, které jsou opravdu docela pěkné. Všechno je dobře promyšlené a rafinované. Řetězení rozhodně spadá do této kategorie. Jakmile jej začnete používat a pochopíte, připadá vám mimořádně přirozený, jako by neměl existovat jiný způsob.
Hlavní myšlenkou je, že používáte více metod v řadě na jednu kolekci prvků.
Řekněme například, že po kliknutí na tlačítko chci změnit třídu i změnit nějaký text. Tlačítko má ale uvnitř nějaký HTML.
Open
S jQuery můžeme „zřetězit“ celou řadu akcí dohromady.
$(".button") .removeClass("open") .addClass("closed") .find(".text") .text("Closed");
To je možné, protože většina metod jQuery, když se používá jako setter, vrací sadu prvků, stejně jako ta, na kterou byla metoda vyvolána. Někdy je tato sada úplně stejná, jako je tomu v případě removeClass
a addClass
zde, a někdy je tato sada změněna, jako je tomu v případě find
.
V příkladu, se kterým jsme pracovali ve videu, jsme také hovořili o tom, .end()
která „vycouvá“ z jedné úrovně řetězce.
$(".button") .removeClass("open") // .button .addClass("closed") // .button .find(".text") // .button .text .text("Closed") // .button .text .end(); // .button .data("thing"); // GETTER on .button
Možná to vysvětluje lépe. Když se sada prvků změní, odsadil jsem řádek jeden a zaznamenal změnu v komentáři. Pak, když .end()
ustoupíme zpět o jednu úroveň. To funguje bez ohledu na to, kolikrát změníte výběr. Všechno končí, když použijete metodu, která vrací něco jiného než sadu prvků.