MoreLesson 276Preview gratis
Syntax Highlighter
Lesson ini bagian dari How To · Semua level
Ringkasan
Syntax highlighter memberi warna pada potongan kode agar struktur dan token mudah dibaca. Untuk halaman sederhana, kode ditampilkan di dalam <pre><code> dan karakter khusus di-escape lebih dulu. Kamu bisa memakai library seperti Prism atau highlight.js, atau membuat penyorot sederhana dengan regex untuk kebutuhan kecil.
Poin kunci
- Escape &, <, dan > sebelum menampilkan kode agar tidak dianggap HTML.
- <pre> mempertahankan spasi dan baris baru; <code> menandai bahwa isinya kode.
- Library highlighter lebih andal karena memahami grammar bahasa pemrograman.
- Jangan pernah memasukkan kode pengguna yang belum disanitasi lewat innerHTML.
Materi lengkap
Contoh kode dan kuis
Materi lengkap, contoh kode, dan kuis tersedia untuk pelanggan. 5 soal.