Menu Pengembang Web Firefox berisi alat untuk memeriksa halaman, menjalankan kode JavaScript arbitrer, dan melihat permintaan HTTP dan pesan lainnya. Firefox 10 menambahkan alat Inspektur baru dan Scratchpad yang diperbarui.
Fitur pengembang web Firefox yang baru, dikombinasikan dengan pengaya pengembang web yang mengagumkan seperti Firebug dan Bilah Alat Pengembang Web, menjadikan Firefox sebagai peramban yang ideal untuk pengembang web. Semua alat tersedia di Pengembang Web di menu Firefox.
Inspektur Halaman
Periksa elemen tertentu dengan mengklik kanan dan memilih Memeriksa (atau menekan Q ). Anda juga dapat meluncurkan Inspektur dari menu Pengembang Web.
Anda akan melihat toolbar di bagian bawah layar, yang dapat Anda gunakan untuk mengontrol inspektur. Elemen yang Anda pilih akan disorot dan elemen lain pada halaman akan diredupkan.
Jika Anda ingin memilih elemen baru, klik Memeriksa pada toolbar, arahkan mouse ke atas halaman dan klik elemen Anda. Firefox menyoroti elemen di bawah kursor Anda.
Anda dapat menavigasi antara elemen induk dan anak dengan mengklik remah roti di toolbar.
Pemeriksa HTML
Klik HTML tombol untuk melihat kode HTML dari elemen yang saat ini dipilih.
Pemeriksa HTML memungkinkan Anda untuk meluaskan dan menciutkan tag HTML, membuatnya mudah untuk divisualisasikan dalam sekejap. Jika Anda ingin melihat HTML halaman dalam file datar, Anda dapat memilih Lihat sumber halaman dari menu Pengembang Web.
Inspektur CSS
Klik Gaya tombol untuk melihat aturan CSS diterapkan ke elemen yang dipilih.
Ada juga panel properti CSS - beralih di antara keduanya dengan mengklik Aturan dan Properti tombol. Untuk membantu Anda menemukan properti tertentu, panel properti menyertakan kotak pencarian.
Anda dapat mengedit CSS elemen dengan cepat dari panel Aturan. Hapus centang salah satu kotak centang untuk menonaktifkan aturan, klik teks untuk mengubah aturan, atau tambahkan aturan Anda sendiri ke elemen di bagian atas panel. Di sini, saya telah menambahkan font-weight: bold; Aturan CSS, membuat teks elemen menjadi tebal.
Scratchpad JavaScript
Scratchpad juga melihat pembaruan dengan Firefox 10, dan sekarang berisi penyorotan sintaks. Anda dapat mengetikkan kode JavaScript untuk dijalankan di halaman saat ini.
Setelah Anda selesai, klik Menjalankan menu dan pilih Lari. Kode berjalan di tab saat ini.
Konsol Web
Konsol Web menggantikan Konsol Kesalahan lama, yang sudah tidak digunakan lagi dan akan dihapus di versi Firefox mendatang.
Konsol menampilkan empat jenis pesan yang berbeda, yang dapat Anda ubah visibilitasnya - permintaan jaringan, pesan kesalahan CSS, pesan kesalahan JavaScript, dan pesan pengembang web.
Apa itu pesan pengembang web? Ini adalah pesan yang dicetak ke objek window.console. Misalnya, kita bisa menjalankan window.console.log (“Halo Dunia”); Kode JavaScript di Scratchpad untuk mencetak pesan pengembang ke konsol. Pengembang web dapat mengintegrasikan pesan-pesan ini ke dalam kode JavaScript mereka untuk membantu proses debug.
Segarkan halaman dan Anda akan melihat permintaan jaringan yang dihasilkan dan pesan lainnya.
Gunakan kotak pencarian untuk memfilter pesan; klik permintaan jika Anda ingin melihat lebih detail.
Mulai Firefox 10, Konsol Web dapat bekerja bersama-sama dengan Page Inspector. Variabel $ 0 mewakili objek yang saat ini dipilih di inspektur. Jadi, misalnya, jika Anda ingin menyembunyikan objek yang sedang dipilih, Anda dapat menjalankannya $ 0.style.display = ”tidak ada” di konsol.
Jika Anda tertarik untuk mempelajari lebih lanjut tentang menggunakan konsol dan fungsi bawaannya, lihat Halaman Konsol Web di situs web Jaringan Pengembang Mozilla.
Dapatkan Lebih Banyak Alat
Itu Dapatkan Lebih Banyak Alat opsi membawa Anda ke koleksi add-on Toolbox Pengembang Web di situs web Mozilla Add-Ons. Ini berisi beberapa add-on terbaik untuk pengembang web , termasuk Firebug dan Bilah Alat Pengembang Web.
Jika Anda telah menggunakan Firefox selama beberapa tahun, Anda mungkin ingat DOM Inspector. Alat pengembang terintegrasi Firefox telah berkembang pesat sejak saat itu.