13Sep
Firefox berisi alat untuk memeriksa halaman, mengeksekusi kode JavaScript yang sewenang-wenang, dan melihat permintaan HTTP dan pesan lainnya. Firefox 10 menambahkan alat Inspektur baru dan Scratchpad yang telah diperbarui. Fitur pengembang web baru
Firefox, yang dikombinasikan dengan add-on pengembang web hebat seperti Firebug dan Web Developer Toolbar, menjadikan Firefox sebagai browser yang ideal untuk pengembang web. Semua alat tersedia di bawah Pengembang Web di menu Firefox.
Page Inspector
Memeriksa elemen tertentu dengan mengklik kanan dan memilih Memeriksa ( atau menekan Q ).Anda juga bisa meluncurkan Inspector dari menu Web Developer.
Anda akan melihat toolbar di bagian bawah layar, yang dapat Anda gunakan untuk mengendalikan inspektur. Elemen pilihan Anda akan disorot dan elemen lainnya di halaman akan redup.
Jika Anda ingin memilih elemen baru, klik tombol Periksa pada bilah alat, arahkan mouse ke 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.
HTML Inspector
Klik tombol HTML untuk melihat kode HTML elemen yang dipilih saat ini.
Pengawas HTML memungkinkan Anda untuk memperluas dan meruntuhkan tag HTML, sehingga mudah untuk divisualisasikan sekilas. Jika Anda ingin melihat HTML halaman dalam file flat, Anda dapat memilih View Page Source dari menu Web Developer.
CSS Inspector
Klik tombol Style untuk melihat aturan CSS yang diterapkan pada elemen yang dipilih.
Ada juga panel properti CSS - beralih di antara keduanya dengan mengklik tombol Aturan dan Properties .Untuk membantu menemukan properti tertentu, panel properti menyertakan kotak telusur.
Anda dapat mengedit elemen CSS dengan cepat dari panel Aturan. Hapus tanda centang pada salah satu kotak centang untuk menonaktifkan sebuah aturan, klik teks untuk mengubah peraturan, atau tambahkan peraturan Anda sendiri ke elemen di bagian atas panel. Di sini, saya telah menambahkan font-weight : bold;Aturan CSS , membuat teks elemen menjadi tebal.
JavaScript Scratchpad
Scratchpad juga melihat pembaruan dengan Firefox 10, dan sekarang berisi penyorotan sintaksis. Anda dapat mengetikkan kode JavaScript untuk berjalan di halaman ini.
Setelah Anda memilikinya, klik menu Execute dan pilih Run. Kode berjalan di tab aktif. Konsol Web
Konsol Web menggantikan Konsol Kesalahan lama, yang telah tidak berlaku lagi dan akan dihapus di versi Firefox yang akan datang.
Konsol menampilkan empat jenis pesan yang berbeda, yang dapat Anda ubah visibilitas - permintaan jaringan, pesan kesalahan CSS, pesan kesalahan JavaScript dan pesan pengembang web.
Apa pesan pengembang web? Ini adalah pesan yang tercetak di jendela. Sebagai contoh, kita bisa menjalankan jendela .console.log( "Hello World"); Kode JavaScript di Scratchpad untuk mencetak pesan pengembang ke konsol. Pengembang web dapat mengintegrasikan pesan ini ke dalam kode JavaScript mereka untuk membantu debugging.
Segarkan halaman dan Anda akan melihat permintaan jaringan dan pesan lainnya yang dihasilkan.
Gunakan kotak pencarian untuk memfilter pesan;klik permintaan jika Anda ingin melihat lebih detail.
Pada Firefox 10, Web Console dapat bekerja sama dengan Page Inspector. Variabel $ 0 mewakili objek yang dipilih saat ini di inspektur. Jadi, misalnya, jika Anda ingin menyembunyikan objek yang dipilih saat ini, Anda dapat menjalankan $ 0.style.display = "none" di konsol.
Jika Anda tertarik untuk belajar lebih banyak tentang penggunaan konsol dan fungsi bawaannya, lihat halaman Web Console di situs web Developer Network Mozilla.
Dapatkan Alat Lainnya
Dapatkan Pilihan Alat membawa Anda ke koleksi add-on Toolbox Web Developer di situs web Add-Ons Mozilla. Ini berisi beberapa pengaya terbaik untuk pengembang web, termasuk Firebug dan Web Developer Toolbar.
Jika Anda telah menggunakan Firefox selama beberapa tahun, Anda mungkin akan mengingat Inspektur DOM.Perangkat pengembang terintegrasi Firefox telah lama berjalan sejak saat itu.