13Sep
Nabídka webového vývojáře Firefoxu obsahuje nástroje pro kontrolu stránek, provádění libovolného kódu JavaScript a zobrazení požadavků HTTP a dalších zpráv. Firefox 10 přidal zcela nový nástroj Inspektoru a aktualizovaný Scratchpad.
Nový webový vývojář Firefoxu v kombinaci s úžasnými doplňky webových vývojářů, jako je Firebug a Web Developer Toolbar, činí z Firefoxu ideální prohlížeč pro webové vývojáře. Všechny nástroje jsou k dispozici pod nabídkou Web Developer v nabídce Firefoxu.
Inspektor stránky
Kontrola určitého prvku klepnutím pravým tlačítkem myši a výběrem Kontrola ( nebo stisknutím Q ).Můžete také spustit inspektor z nabídky Web Developer.
V dolní části obrazovky se zobrazí panel nástrojů, který můžete použít k ovládání inspektoru. Vybraný prvek bude zvýrazněn a ostatní prvky na stránce budou ztlumeny.
Chcete-li vybrat nový prvek, klepněte na panel nástrojů na tlačítko Inspect , umístěte ukazatel myši na stránku a klepněte na prvek. Firefox zvýrazní prvek pod kurzor.
Můžete přecházet mezi nadřazenými a podřízenými prvky kliknutím na strukturu na panelu nástrojů.
HTML inspektor
Klepnutím na tlačítko HTML zobrazíte kód HTML aktuálně vybraného prvku.
Inspektor HTML umožňuje rozšiřovat a sbalit značky HTML, což umožňuje snadné zobrazení na první pohled. Chcete-li vidět HTML stránku v plochém souboru, můžete zvolit Zobrazit zdroj stránky z nabídky Web Developer.
Inspektor CSS
Klepněte na tlačítko pro zobrazení pravidel CSS aplikovaných na vybraný prvek.
K dispozici je také panel vlastností CSS - přepněte mezi dvěma klepnutím na tlačítka a Vlastnosti .Abychom vám pomohli najít konkrétní vlastnosti, panel vlastností obsahuje vyhledávací pole.
CSS elementu můžete editovat za běhu z panelu Pravidla. Zrušte zaškrtnutí políček pro deaktivaci pravidla, klepněte na text pro změnu pravidla nebo přidejte vlastní pravidla k prvku v horní části podokna. Zde jsem přidal font-weight: tučné; pravidlo CSS, takže text prvku je tučný.
JavaScript Scratchpad
Scratchpad také viděl aktualizaci s Firefoxem 10 a nyní obsahuje zvýraznění syntaxe. Můžete zadat kód JavaScript, který se má spustit na aktuální stránce.
Jakmile máte, klepněte na nabídku Spustit a vyberte Run. Kód běží na aktuální kartě.Webová konzola
Webová konzola nahrazuje starou konzolu pro správu chyb, která byla zastaralá a bude odstraněna v budoucí verzi prohlížeče Firefox.
Konzola zobrazuje čtyři různé typy zpráv, které lze přepínat mezi - požadavky na síť, chybové zprávy CSS, chybové zprávy jazyka JavaScript a zprávy vývojáře webu.
Co je to zpráva pro vývojáře? Je to zpráva vytištěná na objektu window.console. Například bychom mohli spustit window.console.log( "Hello World"); JavaScript kód v Scratchpad vytisknout zprávu vývojáře do konzoly. Weboví vývojáři mohou tyto zprávy integrovat do kódu JavaScript, který vám pomůže při ladění.
Obnovte stránku a zobrazí se vygenerované síťové požadavky a další zprávy.
Použijte vyhledávací pole pro filtrování zpráv;Pokud chcete zobrazit další podrobnosti, klikněte na požadavek.
Webová konzola může od verze Firefoxu 10 pracovat společně s Inspektorem stránek. Proměnná $ 0 představuje aktuálně vybraný objekt v inspektoru. Pokud jste například chtěli skrytí aktuálně vybraného objektu, můžete v konzole spustit $ 0.style.display = "none" .
Pokud máte zájem dozvědět se více o používání konzoly a jejích vestavěných funkcí, podívejte se na stránku webové konzoly na webových stránkách vývojářské sítě Mozilly.
Získejte více nástrojů
Volba Získejte více nástrojů Volba vás přenese na webovou stránku doplňků Mozilla Add-On na webovou stránku s vývojářskými nástroji Web Developer. Obsahuje některé z nejlepších doplňků pro webovské vývojáře, včetně Firebugu a panelu nástrojů Web Developer.
Pokud používáte Firefox několik let, můžete si zapamatovat inspektor DOM.Integrované vývojářské nástroje aplikace Firefox od té doby prošly dlouhou cestou.