Πεδίο Δοκιμών Κώδικα
Online παιχνίδι HTML, CSS και JavaScript με ζωντανή προεπισκόπηση, editor με αριθμούς γραμμών και καταγεγραμμένη κονσόλα. Δοκιμάστε αποσπάσματα άμεσα και κατεβάστε το αποτέλεσμα ως ένα αρχείο HTML - εξ ολοκλήρου στον browser.
Τι είναι το πεδίο δοκιμών κώδικα;
Το πεδίο δοκιμών κώδικα είναι ένα sandbox όπου γράφετε HTML, CSS και JavaScript και βλέπετε αμέσως το αποτέλεσμα. Αυτό προσθέτει καταγεγραμμένη κονσόλα, editors με αριθμούς γραμμών και δυνατότητα λήψης της εργασίας σας ως ένα αρχείο HTML.
Πώς λειτουργεί η ζωντανή προεπισκόπηση;
Τα τρία πάνελ κώδικα συνδυάζονται σε πλήρες έγγραφο HTML και αποδίδονται μέσα σε sandbox iframe. Με ενεργή την αυτόματη εκτέλεση, η προεπισκόπηση ανανεώνεται περίπου μισό δευτερόλεπτο μετά τη διακοπή της πληκτρολόγησης· αλλιώς πατήστε Εκτέλεση.
Τι δείχνει το πάνελ της κονσόλας;
Ό,τι γράφει η σελίδα με console.log, info, warn και error, καθώς και σφάλματα εκτέλεσης και μη χειρισμένα promise rejections με τους αριθμούς γραμμών. Καθαρίζει σε κάθε εκτέλεση.
Αποθηκεύεται ο κώδικάς μου αν επαναφορτώσω τη σελίδα;
Ναι. Ένα σχέδιο των τριών πάνελ αποθηκεύεται τοπικά στον browser σας και επαναφέρεται στην επόμενη επίσκεψη. Η Επαναφορά επιστρέφει τον αρχικό κώδικα demo, και η εκκαθάριση των δεδομένων του site διαγράφει το σχέδιο.
Είναι η προεπισκόπηση σε sandbox και ασφαλής;
Η προεπισκόπηση τρέχει σε sandbox iframe χωρίς same-origin πρόσβαση: τα δοκιμαζόμενα scripts δεν μπορούν να διαβάσουν τη σελίδα ή τα cookies της. Παρόλα αυτά δοκιμάζετε μόνο έμπιστο κώδικα, γιατί τρέχει στον browser σας.
Μπορώ να κατεβάσω το πείραμά μου;
Ναι. Η Λήψη .html αποθηκεύει τα τρέχοντα HTML, CSS και JavaScript ενωμένα σε ένα αυτόνομο αρχείο, που ανοίγει σε κάθε browser ή μοιράζεστε.
Τι μπορώ να εκτελέσω στο πάνελ JavaScript;
Τυπικό JavaScript browser: χειρισμό DOM, events, canvas, fetch σε δημόσια APIs (υπό τους κανόνες CORS τους) και οποιαδήποτε βιβλιοθήκη επικολλημένη inline. Modules και πακέτα npm δεν επιλύονται.
Χρειάζεται το πεδίο δοκιμών internet;
Μόνο για τη φόρτωση της σελίδας. Η επεξεργασία, η προεπισκόπηση και η καταγραφή κονσόλας τρέχουν μετά τοπικά, και ο κώδικάς σας δεν αποστέλλεται πουθενά.
Πώς να χρησιμοποιήσετε το Πεδίο Δοκιμών Κώδικα
Αυτή η παιδική χαρά συνδυάζει το HTML, CSS και JavaScript σας σε ζωντανή προεπισκόπηση σε sandbox, εξ ολοκλήρου στον browser σας, με πάνελ κονσόλας που συλλαμβάνει logs και σφάλματα. Ένα προσχέδιο αποθηκεύεται τοπικά ώστε να συνεχίζετε από εκεί που σταματήσατε.
- Επεξεργαστείτε τα πάνελ HTML, CSS και JavaScript — κάθε editor έχει αριθμούς γραμμών και χρωματισμό σύνταξης.
- Με ενεργή την Αυτόματη εκτέλεση, η προεπισκόπηση ανανεώνεται καθώς πληκτρολογείτε· αλλιώς πατήστε Εκτέλεση (ή απενεργοποιήστε την Αυτόματη εκτέλεση και εκτελέστε χειροκίνητα).
- Παρακολουθήστε το πάνελ Κονσόλα κάτω από την προεπισκόπηση: έξοδοι console.log, προειδοποιήσεις, σφάλματα και μη διαχειρισθείσες εξαιρέσεις εμφανίζονται εκεί με αριθμούς γραμμών.
- Πατήστε Επαναφορά για να επιστρέψετε στην ενσωματωμένη demo, ή Λήψη .html για να αποθηκεύσετε τα πάντα σε ένα αυτοτελές αρχείο.
- Χρησιμοποιήστε το Άνοιγμα σε νέο παράθυρο για να δείτε το τρέχον έγγραφο σε πλήρες μέγεθος σε δική του καρτέλα.
Η κονσόλα καθαρίζει σε κάθε εκτέλεση, οπότε προσθέστε ελεύθερα console.log κατά το debugging — εμφανίζονται αμέσως χωρίς να ανοίξετε την πραγματική κονσόλα του browser.
Σχετικά εργαλεία
- Κοσμητής JavaScript Δωρεάν online κοσμητής και μορφοποιητής κώδικα JavaScript. Μετατρέψτε άμεσα τον ελαχιστοποιημένο JS σε καθαρό, αναγνώσιμο κώδικα με σωστή εσοχή και προσαρμόσιμες επιλογές.
- Ελαχιστοποιητής JS Ελαχιστοποιήστε τον κώδικα JavaScript άμεσα. Αφαιρέστε κενά, σχόλια και βελτιστοποιήστε το JS για ταχύτερη φόρτωση.
- Δοκιμαστής Regex Δοκιμάστε και αποσφαλματώστε κανονικές εκφράσεις με αντιστοίχιση σε πραγματικό χρόνο και σύλληψη ομάδων.
- Προεπισκόπηση Markdown Δωρεάν διαδικτυακός επεξεργαστής Markdown με ζωντανή προεπισκόπηση. Γράψτε, αποδώστε και εξάγετε Markdown με πλήρη υποστήριξη GFM.
- Έλεγχος Hash Υπολογίστε και επαληθεύστε hashes MD5, SHA-1, SHA-256, SHA-512 τοπικά
- Υπολογιστής Chmod Δωρεάν διαδικτυακός υπολογιστής chmod για οπτικοποίηση και υπολογισμό δικαιωμάτων αρχείων Linux με πλαίσια ελέγχου. Άμεση μετατροπή μεταξύ αριθμητικής (755, 644) και συμβολικής σημειογραφίας (rwxr-xr-x). Υποστηρίζει ειδικά δικαιώματα όπως setuid, setgid, sticky bit.
- Πίνακας ASCII Πλήρης αναφορά κωδικοποίησης χαρακτήρων ASCII με δεκαδικούς, δεκαεξαδικούς, οκταδικούς, δυαδικούς κωδικούς, οντότητες HTML και περιγραφές χαρακτήρων. Άμεση αναζήτηση και φιλτράρισμα.
- Προβολέας Hex Προβολή περιεχομένων αρχείων σε μορφή hex dump με αναζήτηση, πλοήγηση offset και εικονική κύλιση