We hebben het nu een aantal keer gehad over kleine details in de jQuery API die echt heel leuk zijn. Alles is doordacht en verfijnd. Chaining valt zeker in die categorie. Als je het eenmaal begint te gebruiken en het begrijpt, voelt het buitengewoon natuurlijk aan, alsof er geen andere manier zou moeten zijn.
Het belangrijkste idee is dat u meerdere methoden achter elkaar gebruikt voor een enkele verzameling elementen.
Laten we bijvoorbeeld zeggen dat nadat ik op een knop heb geklikt, ik zowel een klas wil wijzigen als wat tekst wil wijzigen. Maar de knop heeft wat HTML erin.
Open Met jQuery kunnen we de hele reeks acties aan elkaar "ketenen".
$(".button") .removeClass("open") .addClass("closed") .find(".text") .text("Closed");Dit is mogelijk omdat de meeste methoden van jQuery, hoewel ze als setter worden gebruikt, een elementenset retourneren zoals degene waarop de methode werd aangeroepen. Soms is die set precies hetzelfde, zoals het geval is bij removeClassen addClasshier, en soms wordt die set gewijzigd zoals hier het geval is find.
In het voorbeeld waarmee we in de video hebben gewerkt, hebben we ook gesproken over .end()welke "achteruit" één niveau in de ketting gaat.
$(".button") .removeClass("open") // .button .addClass("closed") // .button .find(".text") // .button .text .text("Closed") // .button .text .end(); // .button .data("thing"); // GETTER on .buttonMisschien verklaart dat het beter. Als de set elementen verandert, heb ik de eerste regel ingesprongen en de verandering in de opmerking genoteerd. Als we .end()dan een niveau achteruit gaan. Dit werkt ongeacht hoe vaak u de selectie wijzigt. Het eindigt allemaal wanneer u een methode gebruikt die iets anders retourneert dan een set elementen.