13Sep
Firefoxov spletni program za razvijalce vsebuje orodja za pregledovanje strani, izvajanje poljubne kode JavaScript in ogledovanje zahtev HTTP in drugih sporočil. Firefox 10 je dodal novo orodje Inspector in posodobil Scratchpad.
Nove funkcije spletnega razvijalca v Firefoxu, v kombinaciji z odličnimi dodatki za spletne razvijalce, kot sta Firebug in orodna vrstica za razvijalce spletnih orodij, naredijo Firefox idealen brskalnik za spletne razvijalce. V orodju Web Developer v meniju Firefox so na voljo vsa orodja.
Page Inspector
Oglejte si določen element, tako da z desno miškino tipko kliknete in izberete Inspect ( ali pritisnete Q ). Inspector lahko tudi zaženete v meniju Spletni razvijalec.
Na dnu zaslona boste videli orodno vrstico, ki jo lahko uporabite za nadzor inšpektorja. Vaš izbran element bo označen in drugi elementi na strani bodo zatemnjeni.
Če želite izbrati nov element, kliknite gumb Inspect v orodni vrstici, s kazalcem miške premaknite na stran in kliknite element. Firefox poudarja element pod kazalcem.
Med starševskimi in otroškimi elementi lahko krmarite s klikom drobtin v orodni vrstici.
HTML Inspector
Kliknite gumb HTML , da si ogledate HTML kodo trenutno izbranega elementa.
Inšpektorji HTML vam omogočajo, da razširite in strnete HTML oznake, kar vam olajša vizualizacijo na prvi pogled.Če želite videti HTML strani v ravno datoteko, lahko iz menija spletnega razvijalca izberete View Page Source .
CSS Inspector
Kliknite gumb Style , da si ogledate pravila CSS, ki veljajo za izbrani element.
Obstaja tudi plošča lastnosti CSS - preklapljate med obema, tako da kliknete gumba pravil in Properties .Za pomoč pri iskanju določenih lastnosti plošča z lastnostmi vključuje iskalno polje.
Element CSS lahko uredite na letni plošči s pravilniki. Počistite potrditveno polje, če želite deaktivirati pravilo, kliknite besedilo, če želite spremeniti pravilo, ali pa dodajte svoja pravila elementu na vrhu podokna. Tukaj sem dodal font-weight: bold; pravilo CSS, zaradi česar je besedilo elementa krepko.
JavaScript Scratchpad
Scratchpad je videl tudi posodobitev s Firefoxom 10 in zdaj vsebuje poudarjanje sintakse. V kodo JavaScript lahko vnesete na trenutno stran.
Ko imate, kliknite meni Execute in izberite Run. Koda se izvaja v trenutnem zavihku.
Web konzola
Spletna konzola nadomešča staro konzolo za napake, ki je bila zastarela in bo odstranjena v prihodnji različici Firefoxa.
Konzola prikaže štiri različne vrste sporočil, ki jih lahko preklapljate z vidljivostjo - omrežnimi zahtevami, sporočili o napakah CSS, sporočilih o napaki JavaScript in sporočilih spletnega razvijalca.
Kaj je sporočilo spletnega razvijalca? To je sporočilo, natisnjeno v predmet okno. Na primer, lahko zaženemo window.console.log( "Hello World"); kodo JavaScript v Scratchpad-u, da natisne sporočilo razvijalca v konzolo. Spletni razvijalci lahko ta sporočila vključijo v svojo kodo JavaScripta, ki vam pomaga pri odpravljanju napak.
Osveži stran in videli boste ustvarjene omrežne zahteve in druga sporočila.
Uporabite iskalno polje za filtriranje sporočil;kliknite zahtevo, če želite videti več podrobnosti.
Od Firefox 10 lahko spletna konzola deluje skupaj z inštruktorjem strani. Spremenljivka $ 0 predstavlja trenutno izbran predmet v inšpektorju.Če na primer želite skriti trenutno izbran predmet, lahko v konzoli zaženete $ 0.style.display = "none" .
Če vas zanima več o uporabi konzole in njegovih vgrajenih funkcij, obiščite stran spletnega konzola na spletnem mestu razvijalskega omrežja Mozilla.
Pridobite več orodij
Get More Tools Možnost vas popelje do zbirke dodatkov za orodje Web Developer's Toolbox na spletnem mestu Mozilla Add-Ons. Vsebuje nekaj najboljših dodatkov za razvijalce spletnih mest, vključno z Firebug in orodno vrstico za spletne razvijalce.
Če že nekaj let uporabljate Firefox, se lahko spomnite DOM Inspectorja. Integrirana orodja za razvijalce Firefoxa so že od takrat daleč.