Meniul Firefox Developer Web conține instrumente pentru inspectarea paginilor, executarea codului JavaScript arbitrar și vizualizarea solicitărilor HTTP și a altor mesaje. Firefox 10 a adăugat un nou instrument Inspector și a actualizat Scratchpad.
Noile caracteristici ale dezvoltatorului web Firefox, în combinație cu suplimente minunate pentru dezvoltatori web, cum ar fi Firebug și bara de instrumente pentru dezvoltatori web, fac din Firefox un browser ideal pentru dezvoltatorii web. Toate instrumentele sunt disponibile în Web Developer din meniul Firefox.
Page Inspector
Inspectați un anumit element făcând clic dreapta pe acesta și selectând Inspecta (sau apăsând Î ). De asemenea, puteți lansa fișierul Inspector din meniul Dezvoltator web.
Veți vedea o bară de instrumente în partea de jos a ecranului, pe care o puteți utiliza pentru a controla inspectorul. Elementul selectat va fi evidențiat și alte elemente de pe pagină vor fi estompate.
Dacă doriți să alegeți un element nou, faceți clic pe Inspecta butonul de pe bara de instrumente, treceți cu mouse-ul peste pagină și faceți clic pe elementul dvs. Firefox evidențiază elementul de sub cursorul dvs.
Puteți naviga între elementele părinte și copil făcând clic pe pesmetul din bara de instrumente.
HTML Inspector
Apasă pe HTML pentru a vizualiza codul HTML al elementului selectat în prezent.
Inspectorul HTML vă permite să extindeți și să restrângeți etichetele HTML, facilitând vizualizarea dintr-o privire. Dacă doriți să vedeți codul HTML al paginii într-un fișier plat, puteți selecta Vezi sursa paginii din meniul Dezvoltator web.
CSS Inspector
Apasă pe Stil pentru a vedea regulile CSS aplicate elementului selectat.
Există, de asemenea, un panou de proprietăți CSS - comutați între cele două făcând clic pe Reguli și Proprietăți butoane. Pentru a vă ajuta să găsiți proprietăți specifice, panoul de proprietăți include o casetă de căutare.
Puteți edita CSS a elementului din mers din panoul Reguli. Debifați oricare dintre casetele de selectare pentru a dezactiva o regulă, faceți clic pe text pentru a modifica o regulă sau adăugați propriile reguli la elementul din partea de sus a panoului. Aici, am adăugat font-weight: bold; Regula CSS, făcând textul elementului îndrăzneț.
JavaScript Scratchpad
Scratchpad a văzut, de asemenea, o actualizare cu Firefox 10 și conține acum evidențierea sintaxei. Puteți introduce codul JavaScript pentru a rula pe pagina curentă.
Odată ce ați făcut, faceți clic pe A executa meniu și selectați Alerga. Codul rulează în fila curentă.
Web Console
Consola Web înlocuiește vechea Consolă de erori, care a fost învechită și va fi eliminată într-o versiune viitoare a Firefox.
Consola afișează patru tipuri diferite de mesaje, pe care le puteți comuta vizibilitatea - cereri de rețea, mesaje de eroare CSS, mesaje de eroare JavaScript și mesaje de dezvoltator web.
Ce este un mesaj de dezvoltator web? Este un mesaj tipărit pe obiectul window.console. De exemplu, am putea rula window.console.log („Hello World”); Cod JavaScript în Scratchpad pentru a imprima un mesaj dezvoltator pe consolă. Dezvoltatorii web pot integra aceste mesaje în codul lor JavaScript pentru a ajuta la depanare.
Reîmprospătați pagina și veți vedea solicitările de rețea generate și alte mesaje.
Utilizați caseta de căutare pentru a filtra mesajele; faceți clic pe o solicitare dacă doriți să vedeți mai multe detalii.
Începând cu Firefox 10, Consola Web poate funcționa în tandem cu Page Inspector. Variabila $ 0 reprezintă obiectul selectat în prezent în inspector. De exemplu, dacă doriți să ascundeți obiectul selectat în prezent, puteți rula $ 0.style.display = ”none” în consolă.
Dacă sunteți interesat să aflați mai multe despre utilizarea consolei și a funcțiilor sale integrate, consultați Web Console page pe site-ul web al dezvoltatorului Mozilla Network.
Obțineți mai multe instrumente
Obțineți mai multe instrumente opțiunea vă duce la colecția de programe Web Developer’s Toolbox de pe site-ul web Mozilla Add-Ons. Conține o parte din cele mai bune programe de completare pentru dezvoltatorii web , inclusiv Firebug și bara de instrumente pentru dezvoltatori web.
Dacă folosiți Firefox de câțiva ani, este posibil să vă amintiți de inspectorul DOM. Instrumentele integrate pentru dezvoltatori ale Firefox au parcurs un drum lung de atunci.
