Το jQuery είναι μια βιβλιοθήκη scripting από την πλευρά του πελάτη που χρησιμοποιεί σχεδόν κάθε σύγχρονη ιστοσελίδα - κάνει ιστοσελίδες διαδραστικό. Δεν είναι η μόνη βιβλιοθήκη Javascript, αλλά είναι η πιο ανεπτυγμένη, υποστηριζόμενη και πιο ευρέως χρησιμοποιούμενη. Είναι ένα από τα δομικά στοιχεία κάθε σύγχρονης ιστοσελίδας. Αλλά τι ακριβώς είναι το jQuery, τι το καθιστά τόσο δημοφιλές και γιατί θα πρέπει να σας ενδιαφέρει αν ξεκινάτε ως web developer;
Τι είναι το jQuery;
Το jQuery είναι μια επέκταση του Javascript, μια βιβλιοθήκη λειτουργιών Javascript και βοηθητικών προγραμμάτων που προσθέτουν οπτική γεύση και κάνουν τα προηγμένα χαρακτηριστικά απλά να υλοποιηθούν σε μερικές μόνο γραμμές κώδικα. Υποστηρίζεται σε προγράμματα περιήγησης και ανοιχτού κώδικα. Επιπλέον, μπορείτε να επεκτείνετε τη λειτουργικότητα του jQuery με εύχρηστα plugins.
Το jQuery είναι χτισμένο πάνω από το Javascript, αλλά προσθέτει μεθόδους και λειτουργικότητα που δεν υπάρχουν στην καθαρή Javascript. Δημιουργήθηκε για να απλοποιήσει τη χρήση του Javascript και να καταργήσει τις παρενοχλήσεις που σχετίζονται με διαφορετική εφαρμογή Javascript σε διαφορετικά προγράμματα περιήγησης. Με το jQuery μπορείτε να γράψετε μόνο μία φορά και το jQuery θα ερμηνεύσει τον κώδικα σας σωστά για κάθε πρόγραμμα περιήγησης.
Η κύρια λειτουργία του jQuery είναι για το χειρισμό του DOM (DOM είναι το Μοντέλο αντικειμένου εγγράφου) και σημαίνει την υποκείμενη δομή κάθε ιστοσελίδας που επισκέπτεστε. Κάθε πράγμα που βλέπετε στη σελίδα - και πολλοί που δεν βλέπετε - αντιπροσωπεύονται στο DOM.
Το jQuery δεν είναι η μοναδική βιβλιοθήκη Javascript, αλλά είναι το πιο δημοφιλές - περίπου το 55% των κορυφαίων 10.000 ιστότοπων το χρησιμοποιούν. Πρωτότυπο, MooTools και Scriptaculous είναι δημοφιλείς εναλλακτικές λύσεις, αλλά δεν υποστηρίζονται σχεδόν εξίσου καλά.
Πλευρά πελάτη vs διακομιστή πλευρά
Οι περισσότερες ιστοσελίδες δημιουργούνται στην πλευρά του διακομιστή - το MakeUseOf χρησιμοποιεί PHP και MySQL (με τη μορφή WordPress) για να μεταφέρει τα δεδομένα του άρθρου από μια βάση δεδομένων και στη συνέχεια να εφαρμόσει ένα πρότυπο στα δεδομένα αυτά. Η προκύπτουσα σελίδα αποστέλλεται στο πρόγραμμα περιήγησής σας, ερμηνεύεται και εμφανίζεται σε εσάς. Κάνοντας κλικ σε ένα σύνδεσμο γίνεται μια άλλη αίτηση στη βάση δεδομένων και παράγεται μια άλλη σελίδα. Αλλά τι γίνεται αν θέλετε να δημιουργήσετε κάποια διαδραστικότητα στη σελίδα; Μια φόρμα που ελέγχει το είδος του χρήστη (όπως το Twitter, το οποίο μετράει πόσα γράμματα έχετε αφήσει), ένα κουμπί που εμφανίζει ένα παράθυρο διαλόγου ή ίσως θέλετε να φορτώσετε περισσότερα δεδομένα χωρίς να φορτώσετε ξανά ολόκληρη τη σελίδα;
Αυτό είναι όπου το scripting από την πλευρά του πελάτη μπαίνει στο παιχνίδι. Εκεί ο πελάτης - ο περιηγητής σας - κάνει τη βαριά ανύψωση. Οι περισσότεροι ιστότοποι, συμπεριλαμβανομένου αυτού, περιλαμβάνουν λίγο από τους δύο.
Γιατί να χρησιμοποιήσετε το jQuery;
Visual Flair
jQuery ας αλλάξετε τμήματα της ιστοσελίδας σε απόκριση των ενεργειών των χρηστών. Ως γρήγορο παράδειγμα, κάντε κλικ σε αυτόν τον σύνδεσμο - κάθε σύνδεσμος στη σελίδα θα αλλάξει σε κόκκινο . Αχρηστος? Ίσως, αλλά έχετε το σημείο. Οι παρουσιάσεις εικόνων είναι μια κοινή χρήση του jQuery. Η εξισορρόπηση των άσκοπων οπτικών εφέ και των πραγματικά χρήσιμων προσθηκών στην εμπειρία του χρήστη είναι μέρος της ικανότητας να είστε web developer.
Ακολουθεί μια γρήγορη λίστα με κάποια πραγματικά εκπληκτικά αποτελέσματα που μπορείτε να επιτύχετε.
Εύκολα γεγονότα
Σχεδόν όλο το λογισμικό λειτουργεί σε ένα μοντέλο συμβάντος - κάντε κλικ σε κάτι και ενεργοποιείται ένα συμβάν κλικ. Σύρετε το δάχτυλό σας σε ένα δισκίο και ενεργοποιείται ένα συμβάν drag. Οι εφαρμογές "ακούν" για αυτές τις εκδηλώσεις και κάνουν κάτι - το jQuery σάς επιτρέπει να το κάνετε σε ένα πρόγραμμα περιήγησης.
Εκτελέστε AJAX Απλά
Asynchronous Javascript Και η XML είναι ένας τρόπος επικοινωνίας με έναν απομακρυσμένο διακομιστή χωρίς να χρειάζεται να φορτώσετε άλλη σελίδα. Ένα καλό παράδειγμα είναι η ροή κατάστασης του Facebook. Προσπαθήστε να μετακινηθείτε σε όλες τις ενημερώσεις σας μέχρι να φτάσετε στο κάτω μέρος. Δεν μπορείτε. Μόλις φτάσετε στο τέλος, το jQuery εντοπίζει ότι είστε κοντά και στέλνει αίτημα AJAX για περισσότερες εμφανίσεις.
Στη συνέχεια τα εισάγει στην τρέχουσα σελίδα, χωρίς να συνειδητοποιήσετε. Παίρνετε μια άπειρη ροή ενημερώσεων, αλλά δεν είναι όλα φορτωμένα στην αρχή.
Προηγμένες διεπαφές χρήστη
Μαζί με το plugin πυρήνα του jQuery UI, μπορείτε να δημιουργήσετε πλήρεις εφαρμογές ιστού χρησιμοποιώντας τα τυποποιημένα συστατικά στοιχεία της φόρμας. γραμμές προώθησης, ρυθμιστικά, κουμπιά, καρτέλες, μεταφορά και απόθεση - είναι όλα εκεί. Ένα απλό σύστημα θεμάτων σας επιτρέπει να προσαρμόσετε την εμφάνιση και την αίσθηση ή μπορείτε να χρησιμοποιήσετε μία από τις προεπιλογές.
Πρέπει να φροντίσω;
Αν έχετε κάποιο ενδιαφέρον για την ανάπτυξη ιστοτόπων Ποια γλώσσα προγραμματισμού για να μάθετε - Προγραμματισμός ιστού Ποια γλώσσα προγραμματισμού για να μάθετε - Προγραμματισμός Web Σήμερα θα ρίξουμε μια ματιά στις διάφορες γλώσσες προγραμματισμού στο διαδίκτυο που τροφοδοτούν το Διαδίκτυο. Αυτό είναι το τέταρτο μέρος σε μια σειρά αρχαρίων προγραμματισμού. Στο μέρος 1, μάθαμε τα βασικά του ... Διαβάστε περισσότερα, τότε ναι - jQuery είναι ένα πράγμα που σίγουρα πρέπει να μάθουν. Εάν έχετε ρωτήσει ποτέ τον εαυτό σας "Πώς μπορώ να κάνω το X να κάνει Y όταν ο χρήστης κάνει το Z;", τότε θα αγαπήσετε το jQuery. Η προσθήκη του στον ιστότοπό σας είναι τόσο απλή όσο η προσθήκη ενός συνδέσμου σε αυτό στην κεφαλίδα. ή λέγοντας στο WordPress να το φορτώσει.
Θα θέλατε να μάθετε το jQuery; Ενημερώστε μας στα σχόλια και θα δω τι μπορώ να κάνω.
Συντελεστές εικόνας: Δυναμική περιστρεφόμενη πινακίδα που δημιουργήθηκε με jQuery, PistolSlut.com, Χαρτί που έγινε με το jQuery