Έχουμε μιλήσει αρκετές φορές τώρα για μικρές πινελιές στο jQuery API που είναι πραγματικά πολύ ωραίο. Όλα θεωρούνται καλά και εκλεπτυσμένα. Η αλυσίδα εμπίπτει σίγουρα σε αυτήν την κατηγορία. Μόλις αρχίσετε να το χρησιμοποιείτε και να το καταλάβετε, αισθάνεται εξαιρετικά φυσικό, όπως δεν πρέπει να υπάρχει άλλος τρόπος.
Η κύρια ιδέα είναι ότι χρησιμοποιείτε πολλαπλές μεθόδους στη σειρά σε μία συλλογή στοιχείων.
Για παράδειγμα, ας πούμε αφού κάνω κλικ σε ένα κουμπί που θέλω να αλλάξω μια τάξη καθώς και να αλλάξω κάποιο κείμενο. Αλλά το κουμπί έχει κάποιο HTML μέσα.
Open Με το jQuery, μπορούμε να «αλυσολογήσουμε» ολόκληρη τη σειρά ενεργειών μαζί.
$(".button") .removeClass("open") .addClass("closed") .find(".text") .text("Closed");Αυτό είναι δυνατό επειδή οι περισσότερες από τις μεθόδους του jQuery, ενώ χρησιμοποιούνται ως ρυθμιστές, επιστρέφουν ένα σύνολο στοιχείων όπως αυτό που ζητήθηκε από τη μέθοδο. Μερικές φορές αυτό το σετ είναι ακριβώς το ίδιο, όπως συμβαίνει με removeClassκαι addClassεδώ, και μερικές φορές αυτό το σετ αλλάζει όπως συμβαίνει εδώ find.
Στο παράδειγμα με το οποίο συνεργαστήκαμε στο βίντεο, συζητήσαμε επίσης για το .end()ποιο «υποχωρεί» ένα επίπεδο στην αλυσίδα.
$(".button") .removeClass("open") // .button .addClass("closed") // .button .find(".text") // .button .text .text("Closed") // .button .text .end(); // .button .data("thing"); // GETTER on .buttonΊσως αυτό να το εξηγεί καλύτερα. Όταν αλλάζει το σύνολο των στοιχείων, εσοχή στη γραμμή 1 και σημείωσα την αλλαγή στο σχόλιο. Τότε όταν το κάνουμε .end()πίσω ένα επίπεδο. Αυτό λειτουργεί ανεξάρτητα από το πόσες φορές αλλάζετε την επιλογή. Όλα τελειώνουν όταν χρησιμοποιείτε μια μέθοδο που επιστρέφει κάτι διαφορετικό από ένα σύνολο στοιχείων.