Ponuka pre vývojárov webu Firefox obsahuje nástroje naprehliadanie stránok, vykonávanie ľubovoľného kódu JavaScript a prezeranie požiadaviek HTTP a iných správ. Firefox 10 pridal úplne nový nástroj Inspector a aktualizoval Scratchpad.
Nové funkcie webového vývojára FirefoxuV kombinácii s úžasnými doplnkami pre vývojárov webových stránok, ako je Firebug a Panel nástrojov pre vývojárov webu, sa Firefox stáva ideálnym prehliadačom pre vývojárov webu. Všetky nástroje sú k dispozícii pod položkou Web Developer v ponuke prehliadača Firefox.
Inšpektor stránky
Kliknutím pravým tlačidlom myši na konkrétny prvok a jeho výberom skontrolujete preskúmať (alebo stlačením Q). Môžete tiež spustiť inšpektor z ponuky Web Developer.
V dolnej časti obrazovky sa zobrazí panel s nástrojmi, pomocou ktorého môžete ovládať inšpektora. Vybratý prvok sa zvýrazní a ostatné prvky na stránke sa stlmia.
Ak si chcete zvoliť nový prvok, kliknite na ikonu preskúmať na paneli nástrojov, umiestnite kurzor myši na stránku a kliknite na svoj prvok. Firefox zvýrazňuje prvok pod kurzorom.
Medzi rodičovskými a podradenými prvkami sa môžete pohybovať kliknutím na strúhanku na lište nástrojov.
Inšpektor HTML
Kliknite na ikonu HTML zobrazíte HTML kód aktuálne vybraného prvku.
Inšpektor HTML vám umožňuje rozbaliť a zbaliť značky HTML, čo zjednodušuje vizualizáciu na prvý pohľad. Ak chcete vidieť HTML stránky v plochom súbore, môžete vybrať Zobraziť zdroj stránky z ponuky Web Developer.
Inšpektor CSS
Kliknite na ikonu Štýl zobrazíte pravidlá CSS použité na vybratý prvok.
K dispozícii je tiež panel vlastností CSS - prepínajte medzi nimi kliknutím na ikonu pravidlá a vlastnosti Tlačidlá. Panel vlastností obsahuje vyhľadávacie pole, ktoré vám pomôže nájsť konkrétne vlastnosti.
Môžete CSS prvku upraviť za behupanel pravidiel. Ak chcete pravidlo deaktivovať, zrušte začiarknutie ktoréhokoľvek z políčok, kliknutím na text zmeňte pravidlo alebo do prvku v hornej časti tabla pridajte vlastné pravidlá. Tu som pridal font-weight: bold; Pravidlo CSS, ktorým sa text prvku zvýrazní.
Scratchpad JavaScript
Aplikácia Scratchpad tiež zaznamenala aktualizáciu v prehliadači Firefox 10 a teraz obsahuje zvýraznenie syntaxe. Môžete zadať kód JavaScript, ktorý sa má spustiť na aktuálnej stránke.
Akonáhle budete mať, kliknite na ikonu popraviť a vyberte Spustiť. Kód beží na aktuálnej karte.
Webová konzola
Webová konzola nahrádza starú chybovú konzolu, ktorá bola zastaraná a bude odstránená v budúcej verzii prehliadača Firefox.
Konzola zobrazuje štyri rôzne typy správ, ktoré môžete prepnúť na viditeľnosť - sieťové požiadavky, chybové hlásenia CSS, chybové hlásenia JavaScript a správy vývojárov webu.
Čo je správa pre vývojárov webu? Je to správa vytlačená do objektu window.console. Napríklad by sme mohli spustiť window.console.log („Ahoj svet“); Kód JavaScript v zápisníku, aby sa tlačová správa vývojára vytlačila na konzolu. Weboví vývojári môžu integrovať tieto správy do svojho kódu JavaScript, aby pomohli s ladením.
Obnovte stránku a uvidíte vygenerované sieťové požiadavky a ďalšie správy.
Pomocou vyhľadávacieho poľa môžete správy filtrovať; kliknite na žiadosť, ak chcete vidieť viac podrobností.
Od prehliadača Firefox 10 môže webová konzola fungovaťspolu s inšpektorom stránok. Premenná $ 0 predstavuje aktuálne vybraný objekt v inšpektore. Napríklad, ak chcete skryť aktuálne vybraný objekt, môžete spustiť $ 0.style.display = "none" v konzole.
Ak sa chcete dozvedieť viac o používaní konzoly a jej vstavaných funkciách, pozrite si stránku webovej konzoly na webe Mozilla Developer Network.
Získajte viac nástrojov
Na Získajte viac nástrojov sa dostanete na panel nástrojov pre vývojárov webuzbierka doplnkov na webovej stránke Mozilla Add-Ons. Obsahuje niektoré z najlepších doplnkov pre vývojárov webu, vrátane Firebug a Web Developer Toolbar.
Ak už používate prehliadač Firefox už niekoľko rokov, možno si budete pamätať inšpektora DOM. Integrované vývojárske nástroje Firefoxu odvtedy prešli dlhú cestu.
