Wir haben jetzt einige Male über kleine Details in der jQuery-API gesprochen, die wirklich sehr nett sind. Alles ist gut überlegt und verfeinert. Verkettung fällt definitiv in diese Kategorie. Sobald Sie es verwenden und verstehen, fühlt es sich äußerst natürlich an, als ob es keinen anderen Weg geben sollte.
Die Hauptidee ist, dass Sie mehrere Methoden hintereinander für eine einzelne Sammlung von Elementen verwenden.
Angenommen, ich möchte nach dem Klicken auf eine Schaltfläche eine Klasse sowie Text ändern. Aber die Schaltfläche enthält etwas HTML.
Open Mit jQuery können wir die gesamte Reihe von Aktionen miteinander verketten.
$(".button") .removeClass("open") .addClass("closed") .find(".text") .text("Closed");Dies ist möglich, weil die meisten Methoden von jQuery, obwohl sie als Setter verwendet werden, eine Elementmenge zurückgeben, die genau der entspricht, für die die Methode aufgerufen wurde. Manchmal ist diese Menge genau die gleiche, wie es bei removeClassund addClasshier der Fall ist, und manchmal wird diese Menge geändert, wie es hier bei der Fall ist find.
In dem Beispiel, mit dem wir im Video gearbeitet haben, haben wir auch darüber gesprochen, .end()welches eine Ebene in der Kette „zurückzieht“.
$(".button") .removeClass("open") // .button .addClass("closed") // .button .find(".text") // .button .text .text("Closed") // .button .text .end(); // .button .data("thing"); // GETTER on .buttonVielleicht erklärt es das besser. Wenn sich die Menge der Elemente ändert, habe ich die erste Zeile eingerückt und die Änderung im Kommentar notiert. Dann, wenn wir .end()es zurückziehen, eine Ebene zurück. Dies funktioniert unabhängig davon, wie oft Sie die Auswahl ändern. Alles endet, wenn Sie eine Methode verwenden, die etwas anderes als eine Reihe von Elementen zurückgibt.