Πώς να ανοίξετε την κονσόλα προγραμματιστή στο πρόγραμμα περιήγησης. Προσθήκη νέων εντολών και μεταβλητών. Μετατροπή του προγράμματος περιήγησης σε πρόγραμμα επεξεργασίας κειμένου

Γεια σας, αγαπητοί φίλοι. Ο πίνακας προγραμματιστή (κονσόλα) στο πρόγραμμα περιήγησης είναι απαραίτητο εργαλείογια κάθε ιδιοκτήτη ιστότοπου με τον οποίο μπορείτε να προβάλετε γρήγορα κώδικας htmlσελίδες και στυλ css. Μπορείτε επίσης να μάθετε για σφάλματα που παρουσιάστηκαν κατά τη φόρτωση του ιστότοπου και να ελέγξετε τον ιστότοπο για προσαρμοστικότητα.

Σήμερα θα εξετάσουμε την εργασία με κώδικα html, στυλ css και προσαρμοστικότητα στον πίνακα προγραμματιστών. Αυτά είναι τα εργαλεία που απαιτούνται για την επίλυση των περισσότερων προβλημάτων.

Για κοινή κατανόησηΕπιτρέψτε μου να σας δώσω ένα παράδειγμα για το πότε μπορεί να χρειαστείτε τον πίνακα προγραμματιστών.

Ας υποθέσουμε ότι ήρθατε στο blog μου και σας ενδιέφερε ποια γραμματοσειρά χρησιμοποιώ ή χρώμα και ούτω καθεξής. Γενικά, αυτό μπορεί να είναι οποιοδήποτε στοιχείο στον ιστότοπο. Και θέλατε να κάνετε το ίδιο στον ιστότοπό σας.

Στη συνέχεια, κοιτάζετε μέσα από τον πίνακα προγραμματιστών στο πρόγραμμα περιήγησης στο απαραίτητο στοιχείο, όπου ο κώδικας html και τα στυλ css για αυτό είναι ορατά.

Μια άλλη επιλογή για τη χρήση του πίνακα είναι όταν θέλετε να κάνετε κάτι στον ιστότοπο, αλλά δεν ξέρετε ακόμη πώς θα μοιάζει.

Σε αυτήν την περίπτωση, μπορείτε επίσης να χρησιμοποιήσετε τον πίνακα προγραμματιστών και να δείτε πώς θα φαίνεται η ιδέα σας στο πρόγραμμα περιήγησης. Εξάλλου, όλα όσα κάνετε στον πίνακα προγραμματιστών είναι ορατά μόνο σε εσάς. Και για να είναι ορατά τα πειράματά σας από τους επισκέπτες, θα χρειαστεί να μεταφέρετε στυλ και κώδικες στα αρχεία του ιστότοπου.

Άνοιγμα του πίνακα webmaster και εξοικείωση με τη διεπαφή

Ο πίνακας προγραμματιστών υπάρχει σε κάθε σύγχρονο πρόγραμμα περιήγησης. Για να το ανοίξετε, πρέπει να πατήσετε το πλήκτρο F12 στο πληκτρολόγιό σας.

Διασύνδεση πίνακα μέσα διαφορετικά προγράμματα περιήγησηςθα είναι διαφορετική, αλλά οι αρχές λειτουργίας είναι παρόμοιες.

Προτιμώ τον πίνακα στο πρόγραμμα περιήγησης Firefox.

Το ίδιο το πάνελ χωρίζεται σε δύο μισά και περιέχει καρτέλες και εργαλεία για εργασία.

Στον πίνακα μπορείτε να δείτε τον κώδικα HTML της σελίδας και να τον επεξεργαστείτε ακριβώς εκεί. Για να το κάνετε αυτό, επιλέξτε το επιθυμητό στοιχείο και πατήστε δεξί κουμπίποντίκι και επιλέξτε από το μενού "Επεξεργασία ωςHTML (Επεξεργασίαόπως καιHTML)".


Για να εργαστείτε με στυλ, πρέπει να μεταβείτε στην ενότητα του πίνακα CSS, όπου μπορείτε να προσθέσετε στυλ ή να απενεργοποιήσετε τα υπάρχοντα, αφαιρώντας το πλαίσιο ελέγχου δίπλα τους. Όλα μπορούν να αλλάξουν.

Εδώ μπορείτε να μάθετε σε ποιο αρχείο βρίσκονται τα στυλ και σε ποια γραμμή.

Πώς να αναλύσετε ένα στοιχείο html σε έναν ιστότοπο και να μάθετε τα στυλ css του

Ας δούμε το παράδειγμά μου, το οποίο βρίσκεται σε κάθε άρθρο.

Για να αναλύσετε το επιθυμητό στοιχείο, πρέπει να κάνετε δεξί κλικ πάνω του και να επιλέξετε το στοιχείο μενού .


Η όλη αρχή της εργασίας με κώδικα στον πίνακα είναι ότι πρέπει να επιλέξετε τον κώδικα html στο αριστερό παράθυρο και στο δεξί παράθυρο θα υπάρχουν στυλ για αυτό το στοιχείο.

Και αν όλα είναι αρκετά απλά με τα στυλ, τότε όταν εργάζεστε με κώδικα html πρέπει να κατανοήσετε την ακεραιότητά του. Δηλαδή, κάθε στοιχείο έχει ετικέτες στις οποίες βρίσκεται. Αυτά μπορεί να είναι παράγραφοι, σύνδεσμοι, εικόνες και ούτω καθεξής. Τις περισσότερες φορές αυτά είναι μπλοκ DIV που έχουν μια ετικέτα ανοίγματος < div>και το κλείσιμο div>. Και όλα αυτά είναι ορατά στον πίνακα.


Κατά την αντιγραφή ή την επεξεργασία, είναι σημαντικό να κατανοήσετε πού αρχίζει και πού τελειώνει ένα μπλοκ. Κάνοντας το παραμικρό λάθος εδώ μπορεί να διαταραχθεί ολόκληρη η διάταξη του προτύπου.

Στο εκπαιδευτικό βίντεο θα αναφερθώ λεπτομερώς σε αυτό το σημείο. Και αν θέλετε να κυριαρχήσετε γρήγορα ΒΑΣΙΚΕΣ ΓΝΩΣΕΙΣγια html και css, σας συμβουλεύω να μεταβείτε στη σελίδα "Δωρεάν"και κατεβάστε μαθήματα από τον Evgeniy Popov.

Πώς να αντιγράψετε κώδικα html από τον πίνακα σε αρχεία ιστότοπου

Μπορεί να υπάρχουν πολλές ιδέες για τη χρήση του πίνακα προγραμματιστών. Αφού πειραματιστείτε στον πίνακα, το αποτέλεσμα πρέπει να μεταφερθεί στα αρχεία του ιστότοπου. Και εδώ υπάρχει κάποια δυσκολία. Το γεγονός είναι ότι ο πίνακας εμφανίζει κώδικα html και οι περισσότεροι σύγχρονοι ιστότοποι, συμπεριλαμβανομένων αυτών στην πλατφόρμα WordPress, δημιουργούνται χρησιμοποιώντας τη γλώσσα Προγραμματισμός PHP. Και αυτό είναι σαν τον ουρανό και τη γη.

Λοιπόν, ας δούμε ένα παράδειγμα αντιγραφής ενός banner από το ιστολόγιό μου και μεταφοράς του σε άλλο ιστότοπο.

Για να το κάνετε αυτό, πρέπει να ανοίξετε τον πίνακα προγραμματιστών, εξετάζοντας το επιθυμητό στοιχείο. Αφού καθορίσετε την αρχή του μπλοκ DIV, πατήστε το δεξί κουμπί του μπροστινού σκοπευτηρίου και επιλέξτε το στοιχείο μενού "Αντιγραφή εξωτερικούHTML"


Ο κώδικας έχει αντιγραφεί στο πρόχειρο και τώρα πρέπει να τον επικολλήσετε στο σημείο που θέλετε να δείτε αυτό το banner.

Αυτή η διαδικασία είναι αρκετά δύσκολο να περιγραφεί, γι' αυτό προτείνω να παρακολουθήσετε ένα εκπαιδευτικό βίντεο στο οποίο τα πάντα εξηγούνται και εμφανίζονται λεπτομερώς.

Πώς να μεταφέρετε στυλ από τον πίνακα προγραμματιστών σε αρχεία ιστότοπου

Αφού αποφασίσετε για τον κώδικα και τα στυλ, μπορείτε να ξεκινήσετε τη μεταφορά τους στα αρχεία του ιστότοπου. Επειδή προς το παρόν όλες αυτές οι αλλαγές είναι ορατές μόνο σε εσάς στο πρόγραμμα περιήγησης και εάν ανανεώσετε τη σελίδα, όλες οι αλλαγές θα εξαφανιστούν.

, για μένα είναι πιο βολικό. Εφόσον όταν εργάζεστε στο Notepad++ υπάρχει επισήμανση κώδικα και αρίθμηση γραμμών. Και αυτό βοηθά πολύ όταν δεν χρειάζεται απλώς να αντιγράψετε στυλ, αλλά να κάνετε αλλαγές σε υπάρχοντα. Αυτά τα στυλ είναι εύκολο να βρεθούν με βάση τον αριθμό γραμμής.

Πώς να ελέγξετε την ανταπόκριση του προτύπου στον πίνακα προγραμματιστών

Για να αλλάξετε τον πίνακα σε λειτουργία προσαρμογής, πρέπει να πατήσετε το συνδυασμό πλήκτρων CTRL+SHIFT+M ή το κουμπί στον πίνακα προγραμματιστή, ο οποίος βρίσκεται διαφορετικά σε διαφορετικά προγράμματα περιήγησης.



συμπέρασμα

Σε αυτό το άρθρο, δεν εξέτασα όλα τα εργαλεία του πίνακα προγραμματιστών, αλλά μόνο εκείνα που μπορούν να είναι χρήσιμα και χρησιμοποιούνται συχνότερα από πολλούς webmasters.

Η χρήση του πίνακα και οι δεξιότητες στην εργασία με κώδικα και στυλ είναι απαραίτητες όταν εργάζεστε με ιστότοπους και προγράμματα συνεργατών.

Πάρτε το εργαλείο σε λειτουργία, θα σας φανεί χρήσιμο πολλές φορές.

Εάν έχετε οποιεσδήποτε ερωτήσεις, θα χαρώ να τις απαντήσω στα σχόλια.

Φίλοι μου εύχομαι καλή επιτυχία. Τα λέμε σε νέα άρθρα.

Με εκτίμηση, Maxim Zaitsev.

Εάν η αξιολόγηση της αποτελεσματικότητας του περιεχομένου στη σελίδα της εφαρμογής στο κατάστημα είναι ένα σκοτεινό δάσος για εσάς, δώστε προσοχή Google Play Developers Console. Θα σας πω πώς να εργαστείτε με αυτό το εργαλείο.

Τι είναι το Google Play Developers Console;

Μόλις το αρχείο apk της εφαρμογής σας είναι έτοιμο, πρέπει να το προσθέσετε στο κατάστημα Εφαρμογές GoogleΠαίζω.

Ο αριθμός των νέων χρηστών δεν είναι ίσος με τον αριθμό των εγκαταστάσεων την ίδια περίοδο.

Υπάρχουν δύο διαθέσιμα κριτήρια στην αναφορά: δεδομένα ανά πηγή επισκεψιμότητας και δεδομένα ανά χώρα. Μπορείτε να δημιουργήσετε μια αναφορά για μια ημέρα, μια εβδομάδα ή έναν μήνα, δυστυχώς, δεν μπορείτε να επιλέξετε μια περίοδο αυθαίρετα.

Η αναφορά παρουσιάζεται με τη μορφή διοχέτευσης.

  1. Μοναδικοί επισκέπτες στη σελίδα της εφαρμογής στο κατάστημα.
  2. Ο αριθμός των χρηστών που εγκατέστησαν την εφαρμογή αφού την είδαν.
  3. Αριθμός αγοραστών.
  4. Επαναλαμβανόμενοι πελάτες.

Τα δεδομένα δημιουργούνται με τη μορφή κοόρτης, δηλαδή, η αναφορά για το επιλεγμένο χρονικό εύρος θα περιλαμβάνει μόνο τους χρήστες που επισκέφτηκαν τη σελίδα και εγκατέστησαν την εφαρμογή κατά τη διάρκεια αυτής της χρονικής περιόδου. Γράψαμε για το τι είναι η ανάλυση κοόρτης και γιατί είναι σημαντική για την έρευνα μάρκετινγκ.


Δείκτης Play Store— αυτά είναι τα αποτελέσματα του ASO σας, δηλαδή τα αποτελέσματα της βελτιστοποίησης της σελίδας και της ευρετηρίασής της στο κατάστημα εφαρμογών.

Ουσιαστικά αυτό είναι μοναδικούς χρήστες, που ήρθε στη σελίδα της εφαρμογής σας ως αποτέλεσμα αναζήτησης ή προβολής εφαρμογών στο Play Store.

3. Ενότητα "Βαθμολογίες και κριτικές"

Η υποενότητα "Βαθμολογίες" είναι μια αναφορά που σας επιτρέπει να δείτε τη δυναμική των αξιολογήσεων ανά ημέρα, εβδομάδα, μήνα και να αξιολογήσετε πώς αντιλήφθηκαν οι χρήστες την εφαρμογή μιας νέας λειτουργίας.

Οι "Κριτικές" είναι ένα πεδίο για τις δραστηριότητες του υπεύθυνου φήμης, του ειδικού SMM ή οποιουδήποτε άλλου ατόμου που είναι υπεύθυνο για την επικοινωνία με χρήστες που σας γράφουν αιτήματα/παράπονα σε κριτικές στο κατάστημα.

Σε ΑΥΤΗΝ την ΕΝΟΤΗΤΑ σύστημα GoogleΤο Play Developers Console σας ζητά οικειοθελώς και υποχρεωτικά να κάνετε κάτι και σας δείχνει τι έχετε ήδη κάνει. Για παράδειγμα, προσθέστε στιγμιότυπα οθόνης για tablet εάν η εφαρμογή σας υποστηρίζει τέτοιες συσκευές.

5. Ενότητα "Δεδομένα για το Google Play"

Αυτή η ενότητα συμπληρώνει την προηγούμενη αναφορά καθώς δείχνει τι εμφανίζεται στη σελίδα καταστήματος - γλώσσα, Σύντομη περιγραφή, Πλήρης περιγραφή, εικονίδιο, γραφικά υλικά.

Επί Σελίδα GoogleΠαίξτε, είναι πολύ σκόπιμο να προσθέσετε ένα διαφημιστικό βίντεο, καθώς αυτό επηρεάζει την ελκυστικότητα της σελίδας σας για το κατάστημα και τον χρήστη.

συμπεράσματα

Google Play Developers Console - ένα εργαλείο που μπορεί και πρέπει να χρησιμοποιηθεί για μάρκετινγκ εφαρμογή κινητού. Μόλις κατανοήσετε το Google Play Developers Console, θα καταλάβετε:

  • πώς αντιλαμβάνεται το κατάστημα την αίτησή σας.
  • πώς το κατάστημα δείχνει την αποτελεσματικότητα του περιεχομένου σας στη σελίδα της εφαρμογής.

Ουσιαστικά αυτό είναι σημαντικό σύνδεσμος σύνδεσηςμεταξύ του προγραμματιστή του προϊόντος και των χρηστών του.

Η πρώτη εικόνα είναι μια φωτογραφία του Freddy Fabris από το έργο "The Renaissance Series".

Για μια επισκόπηση των δυνατοτήτων της κονσόλας.

Περιεχόμενα

Εκτύπωση στην κονσόλα

Η εισαγωγή κειμένου στην κονσόλα είναι διαθέσιμη από όλες τις μονάδες και ελέγχεται μέσω της Tier(). Υπάρχουν 3 πρόσθετες εντολές Msg() , DevMsg() και Warning() που υποστηρίζουν μορφοποιημένη έξοδο συμβολοσειράς όπως sprintf():

DevMsg (char const* pMsg, ...) - μόνο σε λειτουργία προγραμματιστή Msg(char const* pMsg, ...) - πάντα, λευκό κείμενο Προειδοποίηση(char const *pMsg, ...) - πάντα, κόκκινο κείμενο

Για συμβατότητα προς τα πίσωΟι εντολές Con_Printf() και Con_DPrintf() έχουν διατηρηθεί από το HL1.

Εκτέλεση εντολών

Ο κινητήρας χρησιμοποιεί μια διεπαφή διακομιστή και πελάτη για την εκτέλεση εντολών (strings). Ο διακομιστής χρησιμοποιεί τη διεπαφή IVEngineServer::ServerCommand():

Engine->ServerCommand("changelevel de_dust\n");

Ο πελάτης χρησιμοποιεί τη διεπαφή IVEngineClient και επιλέγει μεταξύ δύο εντολών, οι οποίες καθορίζουν εάν η εντολή θα εκτελεστεί πρώτα στον πελάτη ή θα σταλεί απευθείας στον διακομιστή:

Engine->ServerCmd("say hello\n"); // στείλτε μια εντολή στον διακομιστή

Engine->ClientCmd("say hello\n"); // εκτελέστε την εντολή στον πελάτη

Προσθήκη νέων εντολών και μεταβλητών

Η κονσόλα προγραμματιστή είναι ένα υποσύστημα της μηχανής Source που δίνει πρόσβαση σε διάφορες μονάδες, αυτό γίνεται μέσω της διεπαφής ICvar (δείτε \public\icvar.h). Αυτή η διεπαφή καταγράφει νέες εντολές και αναζητά υπάρχουσες. Αυτή η διεπαφή είναι προσβάσιμη μέσω της καθολικής μεταβλητής CVAR στον κώδικα πελάτη-διακομιστή (cv στον κωδικό κινητήρα). Εντολές κονσόλαςανήκουν στην κλάση ConCommand και στις μεταβλητές της κονσόλας ConVar , οι οποίες προέρχονται και οι δύο από τη βασική κλάση ConCommandBase (δείτε \public\convar.h).

Η προσθήκη νέων εντολών και μεταβλητών είναι αρκετά απλή και μπορεί να χρησιμοποιηθεί και για τις μονάδες διακομιστή και πελάτη (το ίδιο για ολόκληρο τον κινητήρα). Ο κατασκευαστής αυτών των κλάσεων καταχωρείται αυτόματα νέα ομάδα/variable στο σύστημα της κονσόλας. Αυτό σύντομο παράδειγμαΟ κώδικας προσθέτει μια νέα εντολή my_function και μια νέα μεταβλητή my_variable αρχικοποιημένη σε 42:

#περιλαμβάνω ConVar my_variable("my_variable", "42", FCVAR_ARCHIVE, "Ο αγαπημένος μου αριθμός"); void MyFunction_f(void) ( Msg("This is my function\n"); ) ConCommand my_function("my_function", MyFunction_f, "Shows a message.", FCVAR_CHEAT);

Αυτό κανονική χρήσηόταν το όνομα του αντικειμένου και η εντολή είναι ίδια και οι μεταβλητές χρησιμοποιούνται μόνο σε έναν πηγαίο κώδικα περιγράφονται ως στατικές.

Χρήση της κλάσης ConVar

Αρχικά, ας δούμε τον πιο χρησιμοποιούμενο κατασκευαστή ConVar:

ConVar(char const *pName, char const *pDefaultValue, int flags, char const *pHelpString)

Το πρώτο όρισμα pName είναι το όνομα της μεταβλητής (χωρίς κενά), το επόμενο όρισμα pDefaultValue είναι πάντα μια συμβολοσειρά, ακόμη και για ConVar "s με αριθμητικές τιμές. Το Flags καθορίζει τα ειδικά χαρακτηριστικά μιας μεταβλητής, όλες οι περιγραφές σημαιών ξεκινούν με FCVAR_*, ​​αλλά περισσότερα για αυτό αργότερα. Είναι καλή ιδέα να χρησιμοποιήσετε το pHelpString ώστε οι χρήστες να μπορούν να καταλάβουν σε τι χρησιμεύει η μεταβλητή. Τα ConVars δεν περιορίζονται σε έναν συγκεκριμένο τύπο, η τιμή τους μπορεί να είναι ακέραιος, πραγματικός ή συμβολοσειρά και μπορείτε να το χρησιμοποιήσετε όπως θέλετε. Εφόσον έχετε το ίδιο το αντικείμενο ConVar ή έναν δείκτη σε αυτό, μπορείτε να δείτε και να αλλάξετε την τιμή του απευθείας. Όλα αυτά τα παραδείγματα είναι σωστά και θα δώσουν το ίδιο αποτέλεσμα:

Αν (my_variable.GetInt() == 42) DoSomething(); if (my_variable.GetFloat() == 42.0f) DoSomething(); if (strcmp(my_variable.GetString(), "42")==0) DoSomething();

Για να ορίσετε την τιμή του ConVar, πρέπει να χρησιμοποιήσετε τη συνάρτηση SetValue() χρησιμοποιώντας οποιουσδήποτε τύπους δεδομένων:

My_variable.SetValue(42); my_variable.SetValue(42.0f); my_variable.SetValue("42");

Ανά πάσα στιγμή μπορείτε να επαναφέρετε την τιμή ] στην προεπιλεγμένη τιμή χρησιμοποιώντας τη συνάρτηση Revert().

Εάν το ConVar δημιουργείται σε διαφορετικές λειτουργικές μονάδες, τότε στη διεπαφή ICvar η συνάρτηση FindVar() χρησιμοποιείται για τη λήψη ενός δείκτη στο αντικείμενο εάν έχει οριστεί το όνομα της μεταβλητής. Ακολουθεί ένα απλό παράδειγμα που ελέγχει εάν το ConVar sv_cheats που ορίζεται στη μονάδα κινητήρα είναι εγκατεστημένο:

ConVar *pCheats = cvar->FindVar("sv_cheats"); if (pCheats && pCheats->GetInt() == 1) AllowCheating();

Εύρος σωστές τιμέςμπορεί να οριστεί για αριθμητικά ConVars χρησιμοποιώντας έναν άλλο κατασκευαστή. Στη συνέχεια, το ConVar ελέγχεται αυτόματα από το σύστημα της κονσόλας κάθε φορά που αλλάζει χειροκίνητα. Εάν ο αριθμός που εισάγατε είναι εκτός του εύρους, στρογγυλοποιείται στην επόμενη σωστή τιμή. Ρύθμιση του εύρους των σωστών τιμών από 1 έως 100:

ConVar my_variable("my_variable", "42", 0, "helptext", true, 1, true, 100);

Μερικές φορές θέλετε να ειδοποιηθείτε όταν ο χρήστης ή άλλο υποσύστημα αλλάζει την τιμή του ConVar σας, επομένως μπορεί να ρυθμιστεί μια συνάρτηση επανάκλησης:

Static void OnChangeMyVariable (ConVar *var, char const *pOldString) ( DevMsg("ConVar %s άλλαξε από %s σε %s\n", var->GetName(), pOldString, var->GetString()); ) ConVar my_variable("my_variable", "42", 0, "Ο αγαπημένος μου αριθμός", OnChangeMyVariable);

Χρήση της κλάσης ConCommand

Το Class ConCommand είναι απλούστερο από το ConVar και έχει μόνο έναν κατασκευαστή:

ConCommand(char const *pName, FnCommandCallbackback call, char const *pHelpString = 0, int flags = 0, FnCommandCompletionCallback completionFunc = 0);

Όπως το ConVar, το pName καθορίζει το όνομα της εντολής (χωρίς κενά!). Η επιστροφή κλήσης είναι η συνάρτηση που εκτελείται όταν ο χρήστης εκτελεί αυτήν την εντολή, το pHelpString και οι σημαίες έχουν τις ίδιες λειτουργίες όπως στο ConVar. Το ConCommands υποστηρίζει την αυτόματη συμπλήρωση για την πρώτη παράμετρο, ειδικά όταν χρησιμοποιείται για την επεξεργασία αρχείων. Για παράδειγμα, χρησιμοποιείτε την εντολή loadtext lt;textfilegt ; που προϋποθέτει ένα αρχείο .txt για είσοδο, η κονσόλα αναζητά όλα τα διαθέσιμα αρχεία .txt και επιτρέπει στο χρήστη να επιλέξει ένα από μια λίστα. Εάν είναι σωστό, το completionFunc περάσει, καλείται κάθε φορά που το σύστημα της κονσόλας χρειάζεται μια λίστα με διαθέσιμα ορίσματα.

Όταν εκτελείται η λειτουργία επανάκλησης, οι παράμετροι που εισάγονται στην κονσόλα Δενπαρέχονται ως ορίσματα συνάρτησης. Οι συναρτήσεις επανάκλησης πρέπει να ρωτούν τον κινητήρα πόσα ορίσματα έχουν ληφθεί χρησιμοποιώντας τη συνάρτηση διεπαφής κινητήρα Cmd_Argc() . Στη συνέχεια, μπορείτε να λάβετε τα μεμονωμένα ορίσματα χρησιμοποιώντας το Cmd_Argv(index) , όπου το index 1 είναι το πρώτο όρισμα. Τα ορίσματα επιστρέφονται πάντα ως συμβολοσειρές.

Void MySay_f (void) ( if (engine->Cmd_Argc()< 1) { Msg(""Usage: my_say \n"); return; ) Msg("I say: %s\n", engine->Cmd_Argv(1)); ) ConCommand my_say("my_say", MySay_f, "say something", 0);

Αυτό είναι ένα παράδειγμα για το πώς να δημιουργήσετε μια απλή λίστα αυτόματης συμπλήρωσης. Η ημιτελής παράμετρος δεν χρησιμοποιείται εδώ. περιέχει τους χαρακτήρες που εισήχθησαν πριν από πολύ καιρό (συμπεριλαμβανομένου του ίδιου του ονόματος της εντολής):

Στατική int MySayAutoComplete (char const *partial, char εντολές[ COMMAND_COMPLETION_MAXITEinMS ][ COMMAND_COMPLETION_ITEM_LENGTH ]) ( strcpy(εντολές, "γεια"); strcpy(εντολές, "αντίο"); επιστροφή 2 εντολών; my_say", MySay_f, "say something", 0, MySayAutoComplete);

FCVAR_flags

Οι εντολές/μεταβλητές της κονσόλας χρησιμοποιούν σημαίες που έχουν ορισμένα χαρακτηριστικά και πρέπει να αντιμετωπίζονται με προσοχή. Αυτές οι σημαίες χρησιμοποιούνται από τον κατασκευαστή και μπορούν να αλλάξουν χρησιμοποιώντας το ConCommandBase::AddFlags() (δεν χρησιμοποιείται πολύ συχνά). Δεν είναι δυνατή η αλλαγή αυτών των σημαιών εκτός από το in πηγαίους κώδικεςγια να αποφύγετε τις απάτες. Ορισμένες σημαίες πρέπει να οριστούν χειροκίνητα, άλλες ορίζονται αυτόματα από το σύστημα κονσόλας:

FCVAR_LAUNCHER, FCVAR_GAMEDLL, FCVAR_CLIENTDLL, FCVAR_MATERIAL_SYSTEM, FCVAR_STUDIORENDER

Αυτές οι σημαίες ορίζονται κατά τη διαδικασία εγγραφής και δείχνουν στη μονάδα όπου δημιουργείται η εντολή (δεν χρειάζεται να τις ορίσετε). Οι ακόλουθες σημαίες πρέπει να οριστούν χειροκίνητα:

FCVAR_CHEAT
Χρησιμοποιούνται για εντοπισμό σφαλμάτων και δεν αφαιρούνται από την κυκλοφορία λόγω του γεγονότος ότι μπορεί να απαιτούνται από τους προγραμματιστές mod και χαρτών. Δυστυχώς, δεν μπορούμε να επιτρέψουμε στους κανονικούς παίκτες να χρησιμοποιούν αυτά τα εργαλεία εντοπισμού σφαλμάτων, καθώς αυτό θα ήταν άδικο για άλλους παίκτες (εξαπάτηση). Καλός κανόναςπροσθέστε το FCVAR_CHEAT στην αρχή σε όλες τις νέες εντολές κονσόλας που προσθέτετε, εκτός εάν αυτή είναι η τελική και νόμιμη επιλογή για τους παίκτες. Η εμπειρία δείχνει ότι ακόμη και οι πιο αβλαβείς εντολές εντοπισμού σφαλμάτων μπορούν να χρησιμοποιηθούν με τον ένα ή τον άλλο τρόπο ως εξαπάτηση.

Διακομιστής παιχνιδιώνΡυθμίζοντας sv_cheats αποφασίζει εάν επιτρέπονται ή όχι τα cheat. Εάν ένας πελάτης έχει συνδεθεί σε έναν διακομιστή όπου οι εξαπατήσεις είναι απενεργοποιημένες (θα πρέπει να είναι η προεπιλογή), όλες οι μεταβλητές της κονσόλας πελάτη με την ένδειξη FCVAR_CHEAT επιστρέφουν στην προεπιλεγμένη τιμή τους και δεν μπορούν να αλλάξουν όσο ο πελάτης παραμένει συνδεδεμένος. Οι εντολές της κονσόλας με την ένδειξη FCVAR_CHEAT δεν μπορούν επίσης να εκτελεστούν.

FCVAR_USERINFO
Ορισμένες μεταβλητές κονσόλας περιέχουν πληροφορίες πελάτη που πρέπει να γνωρίζει ο διακομιστής, όπως ονόματα χρήστη ή ρυθμίσεις ονόματος χρήστη. Αυτές οι μεταβλητές πρέπει να επισημαίνονται με τη σημαία FCVAR_USERINFO, στη συνέχεια θα δεσμεύονται στον διακομιστή και θα ενημερώνονται κάθε φορά που ο χρήστης τις αλλάζει. Όταν ο χρήστης αλλάζει αυτές τις μεταβλητές, η μηχανή ειδοποιεί τον κώδικα διακομιστή χρησιμοποιώντας το ClientSettingsChanged() . Ο διακομιστής μπορεί στη συνέχεια να υποβάλει ερώτημα στον κινητήρα για μεμονωμένες ρυθμίσεις πελάτη χρησιμοποιώντας την GetClientConVarValue() .
FCVAR_REPLICATED
Ο διακομιστής του παιχνιδιού και ο πελάτης χρησιμοποιούν τον ίδιο κωδικό, επομένως είναι σημαντικό και οι δύο πλευρές να ακολουθούν την ίδια διαδρομή χρησιμοποιώντας τα ίδια δεδομένα (για παράδειγμα, πρόβλεψη κίνησης/όπλων, κανόνες παιχνιδιού). Εάν αυτός ο κωδικός χρησιμοποιεί μεταβλητές κονσόλας, πρέπει να έχουν τις ίδιες τιμές και στις δύο πλευρές. Η σημαία FCVAR_REPLICATED διασφαλίζει ότι οι τιμές αποστέλλονται σε όλους τους πελάτες. Κατά τη σύνδεση, οι πελάτες δεν μπορούν να αλλάξουν αυτές τις τιμές καθώς θα χρησιμοποιήσουν τις τιμές διακομιστή.
FCVAR_ARCHIVE
Ορισμένες μεταβλητές κονσόλας περιέχουν προσαρμοσμένες ρυθμίσειςθέλουμε να τα επαναφέρουμε κάθε φορά που ξεκινά το παιχνίδι (ως όνομα ή ως ποσοστό_δικτύου). Εάν μια μεταβλητή κονσόλας έχει επισημανθεί ως FCVAR_ARCHIVE, αποθηκεύεται στο αρχείο config.cfg όταν τελειώσει το παιχνίδι και θα φορτωθεί όταν επόμενη εκτόξευση. (Επίσης, η εντολή host_writeconfig θα αποθηκεύσει όλες τις τιμές FCVAR_ARCHIVE σε ένα αρχείο.)
FCVAR_NOTIFY
Εάν μια μεταβλητή κονσόλας επισημαίνεται ως FCVAR_NOTIFY, ο διακομιστής στέλνει ένα μήνυμα σε όλους τους πελάτες κάθε φορά που αλλάζει η μεταβλητή. Αυτό θα πρέπει να χρησιμοποιείται για μεταβλητές που αλλάζουν το παιχνίδι που είναι σημαντικές για όλους τους παίκτες (mp_friendlyfire για παράδειγμα).
FCVAR_PROTECTED
Αυτή είναι μια μεταβλητή κονσόλας που περιέχει ιδιωτικές πληροφορίες(κωδικός για παράδειγμα), δεν θέλουμε να είναι ορατός σε άλλους χρήστες. Για να γίνει αυτό, η σημαία FCVAR_PROTECTED πρέπει να οριστεί για να επισημαίνει αυτές τις πληροφορίες ως εμπιστευτικές.
FCVAR_SPONLY
Μερικές φορές η εκτέλεση μιας εντολής ή η αλλαγή μιας μεταβλητής μπορεί να είναι σωστή μόνο σε λειτουργία ενός χρήστη και, στη συνέχεια, επισημάνετε την εντολή ως FCVAR_SPONLY .
FCVAR_PRINTABLEONLY
Ορισμένες σημαντικές μεταβλητές είναι βαριές ή μεταδίδονται (για παράδειγμα, κανόνες παιχνιδιού) και είναι σημαντικό να περιέχουν μόνο εκτυπώσιμους χαρακτήρες (για παράδειγμα, χωρίς χαρακτήρες ελέγχου).
FCVAR_NEVER_AS_STRING
Αυτή η σημαία λέει στον κινητήρα να μην εξάγει ποτέ αυτήν τη μεταβλητή ως συμβολοσειρά επειδή περιέχει μια ακολουθία χαρακτήρων ελέγχου.
FCVAR_DEMO
Όταν ξεκινάτε την εγγραφή ενός αρχείου επίδειξης, πρέπει να προστεθούν ορισμένες μεταβλητές κονσόλας στην εγγραφή για να βεβαιωθείτε ότι αναπαράγεται σωστά.
FCVAR_DONTRECORD
Αυτό είναι το αντίθετο του FCVAR_DEMO, ορισμένες μεταβλητές κονσόλας δεν πρέπει να εγγράφονται σε αρχεία επίδειξης.

Εάν είστε λάτρης των παιχνιδιών υπολογιστή, τότε πιθανότατα έχετε ακούσει ότι υπάρχει μια συγκεκριμένη κονσόλα προγραμματιστή. Τι είναι όμως; Πως να το χρησιμοποιήσεις; Αποδεικνύεται ότι δεν υπάρχει μόνο σε παιχνίδια υπολογιστή: για παράδειγμα, μπορεί να βρεθεί σε κάθε πρόγραμμα περιήγησης στο Διαδίκτυο. Και μπορεί να είναι απίστευτα χρήσιμο όχι μόνο για τους προγραμματιστές για τους οποίους προοριζόταν αρχικά. Σε αυτό το άρθρο, θα μάθετε από τον προγραμματιστή τι μπορείτε να κάνετε με αυτό, καθώς και ποια οφέλη μπορεί να αποφέρει στους παίκτες.

Τι είναι;

Έτσι, πρώτα απ 'όλα, φυσικά, αξίζει να μιλήσουμε για το τι είναι στην πραγματικότητα η κονσόλα προγραμματιστή. Αυτό ειδικό εργαλείο, που προορίζεται, αντίστοιχα, για προγραμματιστές λογισμικού. Όταν καλείτε μια τέτοια κονσόλα, έχετε τη δυνατότητα να εισάγετε ορισμένες εντολές που διευρύνουν σημαντικά τις δυνατότητές σας. Επομένως, για να το χρησιμοποιήσετε σωστά, πρέπει να γνωρίζετε ακριβώς πώς να το καλέσετε, πώς να το χρησιμοποιήσετε, καθώς και ποιες εντολές μπορούν να γραφτούν εκεί και ποιες ενέργειες να εκτελέσετε. Με την πρώτη ματιά, μπορεί να φαίνεται ότι η κονσόλα προγραμματιστή είναι ένα αρκετά απλό εργαλείο στη χρήση, αλλά στην πραγματικότητα δεν είναι. Θα χρειαστείτε πολλή εξάσκηση για να κυριαρχήσετε στην κονσόλα και να πάρετε γρήγορα το αποτέλεσμα που θέλετε. Ποιο όμως θα πρέπει να είναι αυτό το αποτέλεσμα;

Ήρθε η ώρα να μιλήσουμε για το γιατί υπάρχει η κονσόλα προγραμματιστή. Ο κύριος σκοπός του είναι να διορθώσει το λογισμικό που δημιουργήθηκε από τον προγραμματιστή. Αυτό σημαίνει ότι χρησιμοποιώντας αυτή η κονσόλα, θα μπορείτε να βρείτε σφάλματα στο πρόγραμμα και να τα διορθώσετε, και επίσης να κάνετε το πρόγραμμα να κάνει ό,τι θέλετε, για να δοκιμάσετε απολύτως κάθε πτυχή του πριν το κυκλοφορήσετε προς πώληση. Αντίστοιχα, αυτή η κονσόλα παίζει πολύ σημαντικό ρόλο στη δουλειά ενός ειδικού λογισμικού.

Τις περισσότερες φορές, μπορείτε να συναντήσετε μια τέτοια κονσόλα σε παιχνίδια υπολογιστή και προγράμματα περιήγησης στο Διαδίκτυο, και αυτά είναι που θα συζητηθούν αργότερα στο άρθρο μας. Πρώτα, θα μάθετε πώς να ανοίγετε την κονσόλα προγραμματιστή σε ένα πρόγραμμα περιήγησης στο Διαδίκτυο και να κατανοείτε τι μπορεί να κάνει για εσάς και, στη συνέχεια, θα καταλάβετε πόσο σημαντικό είναι σε ένα παιχνίδι υπολογιστή.

Πώς να ανοίξετε την κονσόλα σε ένα πρόγραμμα περιήγησης;

Φυσικά, ανυπομονείτε για τη στιγμή που μπορείτε να μάθετε γιατί χρειάζεστε αυτήν την κονσόλα στο πρόγραμμα περιήγησης Διαδικτύου που χρησιμοποιείτε καθημερινά, αλλά πρώτα θα πρέπει να μελετήσετε πώς ακριβώς ανοίγει. Αποδεικνύεται ότι είναι διαθέσιμο σε όλα τα προγράμματα περιήγησης και ανοίγει με τον ίδιο τρόπο σχεδόν παντού. Αυτό γίνεται είτε με συνδυασμό Πλήκτρα Ctrl, Shift και I, ή πατώντας ένα μόνο πλήκτρο F12. Θα πρέπει να προσπαθήσετε να ανοίξετε την κονσόλα μόνοι σας και όταν τα καταφέρετε, μπορείτε να συνεχίσετε να διαβάζετε το άρθρο.

Τι κάνει η κονσόλα του προγράμματος περιήγησης;

Όταν εμφανίζετε την κονσόλα του προγράμματος περιήγησης στην οθόνη σας, στην αρχή μπορεί να εκπλαγείτε από όλα όσα βλέπετε. Γεγονός είναι ότι η κονσόλα είναι ένα πολύ πλούσιο σε δυνατότητες εργαλείο και θα σας προσφερθεί μια μεγάλη ποικιλία λειτουργιών. Για παράδειγμα, θα μπορείτε να δείτε ολόκληρο τον κώδικα της σελίδας, να κοιτάξετε κάθε στοιχείο, να δείτε τα στυλ του, ακόμη και το JavaScript που χρησιμοποιείται για καθένα από τα στοιχεία που σας ενδιαφέρουν. Κάθε προγραμματιστής ιστού που έχει δημιουργήσει ιστότοπους για τουλάχιστον μερικούς μήνες γνωρίζει για μια τέτοια κονσόλα και τη χρησιμοποιεί ενεργά, καθώς εκεί μπορείτε ακόμη και να παρακολουθείτε σφάλματα στον κώδικα και να προσπαθήσετε να τα διορθώσετε. Εναλλακτικά, μπορείτε να δοκιμάσετε να αλλάξετε τα στυλ και το περιεχόμενο και να δείτε πώς φαίνεται πριν κάνετε τελικές αλλαγές. Ωστόσο, αυτή η κονσόλα μπορεί να είναι χρήσιμη και στους απλούς χρήστες λόγω της ευελιξίας της, αλλά αυτό δεν συμβαίνει τόσο συχνά. Στα παιχνίδια υπολογιστή, η κονσόλα προγραμματιστή μπορεί να σας είναι χρήσιμη πολύ πιο συχνά. "The Witcher 3", "Minecraft", "Contra" και πολλά άλλα δημοφιλή παιχνίδιαέχετε κονσόλες που μπορείτε να χρησιμοποιήσετε και γι' αυτό θα μιλήσουμε στη συνέχεια.

Κονσόλα σε παιχνίδια υπολογιστή

Όλοι γνωρίζουν την ύπαρξη απατεώνων σε πολλά παιχνίδια υπολογιστή που μπορείτε να εισάγετε για να αποκτήσετε ειδικές ικανότητες. Γιατί να θυμάστε τώρα τις απάτες; Το γεγονός είναι ότι σε ορισμένες περιπτώσεις τον ρόλο των απατεώνων παίζει η κονσόλα προγραμματιστή, αφού σας ανοίγει νέες ευκαιρίες που δεν παρέχονται από το ίδιο το παιχνίδι. Πώς όμως καταλήγει μια τέτοια κονσόλα στα παιχνίδια; Ακριβώς το ίδιο όπως σε οποιοδήποτε λογισμικό! Εξάλλου, τα παιχνίδια είναι επίσης προγράμματα που δημιουργήθηκαν με τον ίδιο τρόπο από προγραμματιστές, χρησιμοποιώντας όλα τα εργαλεία που έχουν στη διάθεσή τους. Έτσι χρησιμοποίησαν την κονσόλα για να δοκιμάσουν όλες τις λειτουργίες και τις δυνατότητες του παιχνιδιού πριν ανακοινώσουν ότι η εργασία σε αυτό τελείωσε. Σε ορισμένες περιπτώσεις, οι προγραμματιστές αφήνουν την κονσόλα στο παιχνίδι ως μπόνους, σε άλλες κλείνουν την πρόσβαση σε αυτήν, ώστε οι παίκτες να μην χρησιμοποιούν προηγμένες λειτουργίες. Και οι δύο περιπτώσεις θα συζητηθούν παρακάτω.

Χρήση της κονσόλας σε παιχνίδια

Ένα από τα πιο εντυπωσιακά παραδείγματα παιχνίδι υπολογιστή, το οποίο έχει άμεση πρόσβαση στην κονσόλα προγραμματιστή, είναι το Contra. Αυτό το shooter με βάση την ομάδα είναι σήμερα ένα υποδειγματικό παράδειγμα στο είδος του. Και χρησιμοποιώντας την κονσόλα, μπορείτε να αλλάξετε το χρώμα, το μέγεθος και το σχήμα της όψης εδώ, να προσθέσετε bots και επίσης να αλλάξετε πολλές άλλες λειτουργίες. Ορισμένα από αυτά επιτρέπονται παντού, ενώ άλλα απαγορεύονται, επομένως μπορείτε να τα χρησιμοποιήσετε μόνο εάν δημιουργήσετε ένα παιχνίδι και ενεργοποιήσετε τη χρήση cheat μέσω της κονσόλας. Η κονσόλα προγραμματιστή λειτουργεί περίπου με τον ίδιο τρόπο στο Minecraft και σε πολλά άλλα δημοφιλή παιχνίδια.

Τροποποιήσεις

Ωστόσο, δεν επιτρέπουν όλα τα παιχνίδια στους προγραμματιστές να εγκαταλείψουν την πρόσβαση στην κονσόλα προγραμματιστή. Το "The Witcher (έκδοση 1.31) 3" είναι το πιο σαφές παράδειγμα του πώς οι προγραμματιστές παιχνιδιών, χρησιμοποιώντας τις λειτουργίες αυτού του οργάνου, για να δοκιμάσουν και να διορθώσουν το παιχνίδι, απέκλεισαν εντελώς την πρόσβαση σε αυτό. Ευτυχώς, υπήρξαν άνθρωποι που κατάφεραν να επαναφέρουν αυτήν την πρόσβαση και κυκλοφόρησαν μια ειδική τροποποίηση, με τη λήψη και την εγκατάσταση στον υπολογιστή σας, θα μπορείτε να χρησιμοποιήσετε την κονσόλα προγραμματιστή, η οποία θα επεκτείνει σημαντικά τις δυνατότητές σας.

Πώς να χρησιμοποιήσετε την κονσόλα προγραμματιστή για περιστροφή Google Chromeσαν επεξεργαστής κειμένου; Τι νόημα έχει το εικονίδιο, γνωστό σε πολλούς από το jQuery,; $ ? Πώς μπορώ να εμφανίσω ένα σύνολο τιμών στην κονσόλα, διαμορφωμένο ως αρκετά αξιοπρεπές τραπέζι; Εάν οι απαντήσεις σε αυτές τις ερωτήσεις δεν σας έρχονται αμέσως στο μυαλό, τότε η καρτέλα Κονσόλααπό εργαλεία Προγραμματιστής του Chromeδεν σου έχει αποκαλυφθεί ακόμη σε όλο του το μεγαλείο.

Με την πρώτη ματιά, έχουμε μπροστά μας μια εντελώς συνηθισμένη κονσόλα JavaScript, η οποία είναι κατάλληλη μόνο για την εμφάνιση αρχείων καταγραφής απόκρισης διακομιστή ή τιμών μεταβλητών. Παρεμπιπτόντως, έτσι το χρησιμοποίησα όταν ξεκίνησα για πρώτη φορά τον προγραμματισμό. Ωστόσο, με τον καιρό, απέκτησα εμπειρία, έμαθα λίγο περισσότερα και ανακάλυψα απροσδόκητα ότι η κονσόλα Chrome μπορεί να κάνει πολλά πράγματα για τα οποία δεν είχα ιδέα. Θέλω να μιλήσω για αυτό σήμερα. Ναι, αν δεν διαβάζετε τώρα στο κινητό, μπορείτε να τα δοκιμάσετε όλα αμέσως.

1. Επιλογή στοιχείων DOM

Εάν είστε εξοικειωμένοι με το jQuery, δεν εναπόκειται σε εμένα να σας πω για τη σημασία δομών όπως $('.class')Και $('id'). Για όσους δεν γνωρίζουν, σας επιτρέπουν να επιλέξετε στοιχεία DOM προσδιορίζοντας τις κλάσεις και τα αναγνωριστικά που τους έχουν εκχωρηθεί. Η κονσόλα προγραμματιστή έχει παρόμοια λειτουργικότητα. Εδώ το "$", ωστόσο, δεν έχει καμία σχέση με το jQuery, αν και ουσιαστικά κάνει το ίδιο πράγμα. Αυτό είναι ένα ψευδώνυμο για τη συνάρτηση document.querySelector().

Εντολές της φόρμας $('tagName'), $('.class'), $('#id')Και $('.class #id')επιστρέψτε το πρώτο στοιχείο DOM που ταιριάζει με τον επιλογέα. Επιπλέον, εάν το jQuery είναι διαθέσιμο στο έγγραφο, το "$" του θα παρακαμφθεί από αυτήν τη λειτουργία της κονσόλας.

Υπάρχει ένα άλλο σχέδιο εδώ: $$ . Η χρήση του μοιάζει $$('Όνομα ετικέτας')ή $$('.class'). Σας επιτρέπει να επιλέξετε όλα τα στοιχεία DOM που ταιριάζουν με έναν επιλογέα και να τα τοποθετήσετε σε έναν πίνακα. Η εργασία με αυτό δεν διαφέρει από άλλες συστοιχίες. Για να επιλέξετε ένα συγκεκριμένο στοιχείο, μπορείτε να αποκτήσετε πρόσβαση σε αυτό κατά ευρετήριο.

Για παράδειγμα, η εντολή $$('.className')θα μας παρέχει έναν πίνακα με όλα τα στοιχεία της σελίδας με το όνομα της κλάσης που καθορίζεται κατά την κλήση της. Της ομάδας $$('.className')Και $$('.className') θα δώσει πρόσβαση, αντίστοιχα, στο πρώτο και το δεύτερο στοιχείο του πίνακα που προκύπτει.



Πειραματισμός με εντολές $ Και $$

2. Μετατρέψτε το πρόγραμμα περιήγησης σε πρόγραμμα επεξεργασίας κειμένου

Έχετε πιάσει ποτέ τον εαυτό σας να σκέφτεται ότι θα ήταν ωραίο να επεξεργαστείτε το κείμενο της ιστοσελίδας που διορθώνετε απευθείας στο πρόγραμμα περιήγησης; Εάν ναι, τότε θα σας αρέσει η εντολή που φαίνεται παρακάτω.

Document.body.contentEditable=true

Μετά την εκτέλεσή του στην κονσόλα, το έγγραφο που ανοίγει στο πρόγραμμα περιήγησης μπορεί να επεξεργαστεί χωρίς να απαιτείται αναζήτηση το επιθυμητό θραύσμασε κώδικα HTML.

3. Εύρεση χειριστών συμβάντων συνδεδεμένων σε ένα στοιχείο

Κατά τη διάρκεια του εντοπισμού σφαλμάτων, μπορεί να χρειαστεί να βρείτε προγράμματα χειρισμού συμβάντων που είναι συνδεδεμένα με στοιχεία. Αυτό είναι πολύ εύκολο να γίνει χρησιμοποιώντας την κονσόλα. Το μόνο που χρειάζεται να κάνετε είναι να χρησιμοποιήσετε αυτήν την εντολή:

GetEventListeners($('επιλογέας'))

Ως αποτέλεσμα της εκτέλεσής του, θα δημιουργηθεί ένας πίνακας αντικειμένων που θα περιέχει μια λίστα γεγονότων στα οποία μπορεί να ανταποκριθεί το στοιχείο.



Χειριστές συμβάντων

Για να βρείτε έναν χειριστή για ένα συγκεκριμένο συμβάν, μπορείτε να χρησιμοποιήσετε την ακόλουθη κατασκευή:

GetEventListeners($('selector')).eventName.listener

Αυτή η εντολή θα εκτυπώσει τον κωδικό λειτουργίας του προγράμματος χειρισμού συμβάντων. Εδώ Όνομα συμβάντοςείναι ένας πίνακας που περιέχει όλα τα συμβάντα συγκεκριμένου τύπου. Για παράδειγμα, στην πράξη μπορεί να μοιάζει με αυτό:

GetEventListeners($('#firstName')).click.listener

Ως αποτέλεσμα, θα λάβουμε τον κωδικό της συνάρτησης που σχετίζεται με το συμβάν Κάντε κλικστοιχείο με αναγνωριστικό όνομα.

4. Παρακολούθηση γεγονότων

Εάν θέλετε να παρατηρήσετε την εμφάνιση συμβάντων που συνδέονται με ένα συγκεκριμένο στοιχείο DOM, η κονσόλα μπορεί να σας βοηθήσει σε αυτό. Ακολουθούν ορισμένες εντολές που μπορείτε να χρησιμοποιήσετε για την παρακολούθηση συμβάντων.

  • Ομάδα monitorEvents($('επιλογέας'))σας επιτρέπει να οργανώσετε την παρακολούθηση όλων των συμβάντων που σχετίζονται με το στοιχείο στο οποίο αντιστοιχεί ο επιλογέας. Όταν συμβαίνει ένα συμβάν, γίνεται μια καταχώρηση στην κονσόλα. Για παράδειγμα, η εντολή monitorEvents($('#firstName'))θα σας επιτρέψει να καταγράψετε όλα τα συμβάντα που σχετίζονται με ένα στοιχείο του οποίου το αναγνωριστικό είναι όνομα.
  • Ομάδα monitorEvents($('selector'),'eventName')παρόμοια με την προηγούμενη, αλλά απευθύνεται σε ένα συγκεκριμένο γεγονός. Εδώ, εκτός από τον επιλογέα στοιχείων, το όνομα συμβάντος μεταβιβάζεται επίσης στη συνάρτηση. Αυτή η εντολή θα σας επιτρέψει να εμφανίσετε δεδομένα σχετικά με την εμφάνιση ενός συμβάντος στην κονσόλα. Για παράδειγμα, η εντολή monitorEvents($('#firstName'),'click')θα εμφανίζει πληροφορίες μόνο για το συμβάν Κάντε κλικστοιχείο με αναγνωριστικό όνομα.
  • Ομάδα monitorEvents($('selector'),['eventName1','eventName3",….])σας επιτρέπει να παρακολουθείτε πολλαπλά επιλεγμένα συμβάντα. Εδώ μεταβιβάζεται ένας πίνακας συμβολοσειρών στη συνάρτηση, η οποία περιέχει τα ονόματα των συμβάντων. Για παράδειγμα, αυτή η εντολή: monitorEvents($('#firstName'),['click','focus'])θα εξάγει πληροφορίες συμβάντων στην κονσόλα Κάντε κλικΚαι Συγκεντρώνωγια στοιχείο με αναγνωριστικό όνομα.
  • Ομάδα unmonitorEvents($('επιλογέας'))σας επιτρέπει να διακόψετε την παρακολούθηση και την καταγραφή συμβάντων στην κονσόλα.

5. Μέτρηση του χρόνου εκτέλεσης ενός τμήματος κώδικα

Η λειτουργία προβολής είναι διαθέσιμη στην κονσόλα Chrome console.time('labelName'), το οποίο παίρνει μια ετικέτα ως όρισμα και ξεκινά ένα χρονόμετρο. Μια ακόμη λειτουργία console.timeEnd('labelName'), σταματά το χρονόμετρο στο οποίο έχει εκχωρηθεί η ετικέτα που της έχει μεταβιβαστεί. Ακολουθεί ένα παράδειγμα χρήσης αυτών των συναρτήσεων:

Console.time("myTime"); //Εκκινεί ένα χρονόμετρο με την ένδειξη myTime console.timeEnd("myTime"); //Διακόπτει το χρονόμετρο με την ένδειξη myTime //Έξοδος: myTime:123,00 ms

Το παραπάνω παράδειγμα σάς επιτρέπει να μάθετε το χρόνο μεταξύ της έναρξης και της διακοπής ενός χρονοδιακόπτη. Μπορείτε να κάνετε το ίδιο πράγμα μέσα σε ένα πρόγραμμα JavaScript και να βρείτε το χρόνο εκτέλεσης ενός κομματιού κώδικα.

Ας πούμε ότι πρέπει να μάθω τη διάρκεια ενός βρόχου. Μπορείτε να το κάνετε ως εξής:

Console.time("myTime"); // Ξεκινά ένα χρονόμετρο με την ένδειξη myTime for(var i=0; i< 100000; i++){ 2+4+5; } console.timeEnd("mytime"); // Останавливает таймер с меткой myTime //Вывод - myTime:12345.00 ms

6. Εμφάνιση των τιμών των μεταβλητών με τη μορφή πινάκων

Ας υποθέσουμε ότι έχουμε μια σειρά από αντικείμενα όπως αυτό:

Var myArray=[(a:1,b:2,c:3),(a:1,b:2,c:3,d:4),(k:11,f:22),(a:1 ,β:2,γ:3)]

Εάν το εμφανίσετε στην κονσόλα, θα έχετε μια ιεραρχική δομή με τη μορφή, στην πραγματικότητα, μιας σειράς αντικειμένων. Αυτό - χρήσιμη ευκαιρία, οι κλάδοι της δομής μπορούν να επεκταθούν με την προβολή των περιεχομένων των αντικειμένων. Ωστόσο, με αυτήν την προσέγγιση είναι δύσκολο να κατανοήσουμε, για παράδειγμα, πώς σχετίζονται οι ιδιότητες παρόμοιων στοιχείων. Για να είναι πιο βολική η εργασία με τέτοια δεδομένα, μπορούν να μετατραπούν σε μορφή πίνακα. Για να το κάνετε αυτό, χρησιμοποιήστε την ακόλουθη εντολή:

Console.table(variableName)

Σας επιτρέπει να εμφανίσετε μια μεταβλητή και όλες τις ιδιότητες της σε μορφή πίνακα. Εδώ είναι πώς φαίνεται.



Εμφάνιση μιας σειράς αντικειμένων ως πίνακα

7. Δείτε τον κωδικό στοιχείου

Μπορείτε να μεταβείτε γρήγορα στον κωδικό στοιχείου από την κονσόλα χρησιμοποιώντας τις ακόλουθες εντολές:

  • Ομάδα επιθεώρηση($('επιλογέας'))σας επιτρέπει να ανοίξετε τον κωδικό του στοιχείου που αντιστοιχεί στον επιλογέα στον πίνακα Στοιχείαεργαλεία προγραμματιστής GoogleΧρώμιο. Για παράδειγμα, η εντολή inspect($('#firstName'))θα σας επιτρέψει να προβάλετε τον κωδικό ενός στοιχείου με ένα αναγνωριστικό όνομα. Ομάδα επιθεώρηση ($$('a'))θα ανοίξει τον κωδικό για τον τέταρτο σύνδεσμο που υπάρχει στο DOM.
  • Εντολές της φόρμας $0 , $1 , $2 Σας επιτρέπει να πλοηγηθείτε γρήγορα σε στοιχεία που προβάλατε πρόσφατα. Για παράδειγμα, $0 θα ανοίξει τον κωδικό του στοιχείου που προβλήθηκε πιο πρόσφατα και ούτω καθεξής.

8. Εμφάνιση λίστας ιδιοτήτων στοιχείων

Εάν πρέπει να δείτε τη λίστα των ιδιοτήτων ενός στοιχείου, η κονσόλα θα σας βοηθήσει και σε αυτό. Εδώ χρησιμοποιείται η ακόλουθη εντολή:

Διεύθυνση($('επιλογέας'))

Επιστρέφει ένα αντικείμενο που περιέχει ιδιότητες που σχετίζονται με δεδομένο στοιχείο DOM. Όπως και σε άλλες παρόμοιες περιπτώσεις, τα περιεχόμενα αυτού του αντικειμένου μπορούν να εξεταστούν με την προβολή της δενδρικής δομής του.

9. Κλήση του τελευταίου ληφθέντος αποτελέσματος

Η κονσόλα μπορεί να χρησιμοποιηθεί ως αριθμομηχανή, όπως πιθανότατα γνωρίζουν όλοι. Λίγοι όμως γνωρίζουν ότι διαθέτει ενσωματωμένα εργαλεία που σας επιτρέπουν να χρησιμοποιείτε τα αποτελέσματα προηγούμενων υπολογισμών σε εντολές. Από το σχεδιασμό $_ μπορείτε να ανακτήσετε το αποτέλεσμα της προηγούμενης έκφρασης από τη μνήμη. Έτσι φαίνεται:

2+3+4 9 //- Το αποτέλεσμα της άθροισης είναι 9 $_ 9 // Εμφανίζεται το τελευταίο αποτέλεσμα που λήφθηκε $_ * $_ 81 // Εφόσον το τελευταίο αποτέλεσμα είναι 9, έχουμε 81 Math.sqrt($ _) 9 // Τετραγωνική ρίζααπό το τελευταίο αποτέλεσμα, που ήταν 81 $_ 9 // Παίρνουμε ξανά 9 - το αποτέλεσμα του προηγούμενου υπολογισμού

10. Καθαρισμός κονσόλας και μνήμης

Εάν πρέπει να καθαρίσετε την κονσόλα και τη μνήμη, χρησιμοποιήστε αυτήν την απλή εντολή:

Αφού πατήσετε το Enter, η καθαρή κονσόλα θα είναι έτοιμη για νέα πειράματα.
Αυτό είναι όλο.

11, 12, 13, 14…

Ειλικρινά μιλώντας, δεν είναι μόνο αυτό. Έδειξα μόνο μερικές από τις μη προφανείς δυνατότητες της κονσόλας Google Chrome. Στην πραγματικότητα, υπάρχουν πολλά περισσότερα από αυτά. Είμαι βέβαιος ότι μπορείτε να επεκτείνετε τη λίστα μου με τα δικά σας ευρήματα.

Ελπίζω η ιστορία μου να σας βοήθησε να μάθετε κάτι χρήσιμο, εξοικονομώντας χρόνο για την κονσόλα Chrome που αξίζει να γίνει μέρος του καθημερινού οπλοστασίου ενός προγραμματιστή Ιστού.