Το μενού του Web Developer του Firefox περιέχει εργαλεία για τον έλεγχο σελίδων, την εκτέλεση αυθαίρετου κώδικα JavaScript και την προβολή αιτημάτων HTTP και άλλων μηνυμάτων. Ο Firefox 10 πρόσθεσε ένα ολοκαίνουργιο εργαλείο επιθεώρησης και ενημερώθηκε το Scratchpad.
Οι νέες δυνατότητες του Firefox για προγραμματιστές ιστού, σε συνδυασμό με εκπληκτικά πρόσθετα για προγραμματιστές ιστού όπως το Firebug και το Web Developer Toolbar, καθιστούν το Firefox ένα ιδανικό πρόγραμμα περιήγησης για προγραμματιστές ιστού. Όλα τα εργαλεία είναι διαθέσιμα στο Web Developer στο μενού του Firefox.
Επιθεωρητής σελίδας
Επιθεωρήστε ένα συγκεκριμένο στοιχείο κάνοντας δεξί κλικ και επιλέγοντας Επιθεωρώ (ή πατώντας Ερ ). Μπορείτε επίσης να ξεκινήσετε το Επιθεωρητής από το μενού Web Developer.
Θα δείτε μια γραμμή εργαλείων στο κάτω μέρος της οθόνης, την οποία μπορείτε να χρησιμοποιήσετε για τον έλεγχο του επιθεωρητή. Το επιλεγμένο στοιχείο σας θα επισημανθεί και άλλα στοιχεία στη σελίδα θα μειωθούν.
Εάν θέλετε να επιλέξετε ένα νέο στοιχείο, κάντε κλικ στο Επιθεωρώ κουμπί στη γραμμή εργαλείων, τοποθετήστε το δείκτη του ποντικιού πάνω από τη σελίδα και κάντε κλικ στο στοιχείο σας. Ο Firefox επισημαίνει το στοιχείο κάτω από τον κέρσορα.
Μπορείτε να πλοηγηθείτε μεταξύ γονικών και θυγατρικών στοιχείων κάνοντας κλικ στη γραμμή εργαλείων στη γραμμή εργαλείων.
Επιθεωρητής HTML
Κάντε κλικ στο HTML για να δείτε τον κώδικα HTML του επιλεγμένου στοιχείου.
Ο ελεγκτής HTML σάς επιτρέπει να επεκτείνετε και να συμπτύξετε τις ετικέτες HTML, καθιστώντας εύκολη την οπτική απεικόνιση με μια ματιά. Εάν θέλετε να δείτε το HTML της σελίδας σε ένα επίπεδο αρχείο, μπορείτε να επιλέξετε Δες την πηγή της σελίδας από το μενού Web Developer.
Επιθεωρητής CSS
Κάντε κλικ στο Στυλ κουμπί για να δείτε τους κανόνες CSS που εφαρμόζονται στο επιλεγμένο στοιχείο.
Υπάρχει επίσης ένας πίνακας ιδιοτήτων CSS - εναλλαγή μεταξύ των δύο κάνοντας κλικ στο Κανόνες και Ιδιότητες κουμπιά. Για να σας βοηθήσουμε να βρείτε συγκεκριμένες ιδιότητες, το πλαίσιο ιδιοτήτων περιλαμβάνει ένα πλαίσιο αναζήτησης.
Μπορείτε να επεξεργαστείτε το CSS του στοιχείου εν κινήσει από τον πίνακα κανόνων. Καταργήστε την επιλογή οποιουδήποτε από τα πλαίσια ελέγχου για να απενεργοποιήσετε έναν κανόνα, κάντε κλικ στο κείμενο για να αλλάξετε έναν κανόνα ή προσθέστε τους δικούς σας κανόνες στο στοιχείο στο επάνω μέρος του παραθύρου. Εδώ, έχω προσθέσει το γραμματοσειρά: έντονο; Κανόνας CSS, καθιστώντας το κείμενο του στοιχείου έντονο.
Scratchpad JavaScript
Το Scratchpad είδε επίσης μια ενημέρωση με τον Firefox 10 και τώρα περιέχει επισήμανση σύνταξης. Μπορείτε να πληκτρολογήσετε κώδικα JavaScript για εκτέλεση στην τρέχουσα σελίδα.
Μόλις το κάνετε, κάντε κλικ στο Εκτέλεση μενού και επιλέξτε Τρέξιμο. Ο κωδικός εκτελείται στην τρέχουσα καρτέλα.
Κονσόλα ιστού
Η Κονσόλα Web αντικαθιστά την παλιά Κονσόλα σφάλματος, η οποία έχει καταργηθεί και θα καταργηθεί σε μια μελλοντική έκδοση του Firefox.
Η κονσόλα εμφανίζει τέσσερις διαφορετικούς τύπους μηνυμάτων, τους οποίους μπορείτε να αλλάξετε την ορατότητα - αιτήματα δικτύου, μηνύματα σφάλματος CSS, μηνύματα σφάλματος JavaScript και μηνύματα προγραμματιστή ιστού.
Τι είναι ένα μήνυμα προγραμματιστή ιστού; Είναι ένα μήνυμα που εκτυπώνεται στο αντικείμενο window.console. Για παράδειγμα, θα μπορούσαμε να τρέξουμε το window.console.log ("Γεια σας Κόσμος"); Κωδικός JavaScript στο Scratchpad για να εκτυπώσετε ένα μήνυμα προγραμματιστή στην κονσόλα. Οι προγραμματιστές ιστού μπορούν να ενσωματώσουν αυτά τα μηνύματα στον κώδικα JavaScript για να βοηθήσουν στην αποσφαλμάτωση.
Ανανεώστε τη σελίδα και θα δείτε τα παραγόμενα αιτήματα δικτύου και άλλα μηνύματα.
Χρησιμοποιήστε το πλαίσιο αναζήτησης για να φιλτράρετε τα μηνύματα. κάντε κλικ σε ένα αίτημα εάν θέλετε να δείτε περισσότερες λεπτομέρειες.
Από τον Firefox 10, η Κονσόλα Web μπορεί να συνεργαστεί με το Page Inspector. Η μεταβλητή $ 0 αντιπροσωπεύει το τρέχον επιλεγμένο αντικείμενο στον επιθεωρητή. Έτσι, για παράδειγμα, εάν θέλετε να αποκρύψετε το τρέχον επιλεγμένο αντικείμενο, θα μπορούσατε να εκτελέσετε $ 0.style.display = "κανένας" στην κονσόλα.
Εάν σας ενδιαφέρει να μάθετε περισσότερα σχετικά με τη χρήση της κονσόλας και των ενσωματωμένων λειτουργιών της, ρίξτε μια ματιά στο Σελίδα Κονσόλας Ιστού στον ιστότοπο του Δικτύου προγραμματιστών της Mozilla.
Λάβετε περισσότερα εργαλεία
ο Λάβετε περισσότερα εργαλεία Η επιλογή σας μεταφέρει στη συλλογή πρόσθετων εργαλείων του Web Developer στον ιστότοπο του Mozilla Add-Ons. Περιέχει μερικά από τα τα καλύτερα πρόσθετα για προγραμματιστές ιστού , συμπεριλαμβανομένου του Firebug και της Γραμμής εργαλείων για προγραμματιστές ιστού.
Εάν χρησιμοποιείτε το Firefox για μερικά χρόνια, μπορεί να θυμάστε το DOM Inspector. Τα ενσωματωμένα εργαλεία προγραμματιστών του Firefox έχουν προχωρήσει πολύ από τότε.
