Menu programistyczne przeglądarki Firefox zawiera narzędzia do sprawdzania stron, wykonywania dowolnych kodów JavaScript oraz przeglądania żądań HTTP i innych wiadomości. Firefox 10 dodał zupełnie nowe narzędzie Inspector i zaktualizował Scratchpad.
Nowe funkcje programistyczne Firefoksa, w połączeniu z niesamowitymi dodatkami programistycznymi, takimi jak Firebug i Web Developer Toolbar, sprawiają, że Firefox jest idealną przeglądarką dla twórców stron internetowych. Wszystkie narzędzia są dostępne pod Web Developer w menu Firefoksa.
Sprawdź określony element, klikając go prawym przyciskiem myszy i wybierając Sprawdzać (lub naciśnięcie Q). Możesz także uruchomić Inspektor z menu Web Developer.
Zobaczysz pasek narzędzi u dołu ekranu, za pomocą którego możesz kontrolować inspektora. Wybrany element zostanie podświetlony, a pozostałe elementy na stronie zostaną przyciemnione.
Jeśli chcesz wybrać nowy element, kliknij przycisk Sprawdzać na pasku narzędzi, najedź myszą na stronę i kliknij swój element. Firefox podświetla element pod kursorem.
Możesz nawigować między elementami nadrzędnymi i podrzędnymi, klikając menu nawigacyjne na pasku narzędzi.
Kliknij HTML , aby wyświetlić kod HTML aktualnie wybranego elementu.
Inspektor HTML pozwala na rozwijanie i zwijanie znaczników HTML, co ułatwia wizualizację na pierwszy rzut oka. Jeśli chcesz zobaczyć kod HTML strony w pliku tekstowym, możesz wybrać Zobacz stronę źródłową z menu Web Developer.
Kliknij Styl , aby zobaczyć reguły CSS zastosowane do wybranego elementu.
Istnieje również panel właściwości CSS - przełącz między nimi, klikając przycisk Reguły i Nieruchomości guziki. Aby pomóc Ci znaleźć określone właściwości, panel właściwości zawiera pole wyszukiwania.
Możesz edytować CSS elementu w locie z panelu Reguły. Usuń zaznaczenie któregokolwiek z pól wyboru, aby dezaktywować regułę, kliknij tekst, aby zmienić regułę lub dodaj własne reguły do elementu w górnej części okienka. Tutaj dodałem font-weight: bold; Reguła CSS, dzięki czemu tekst elementu jest pogrubiony.
Brudnopis zobaczył również aktualizację w Firefoksie 10, a teraz zawiera podświetlanie składni. Możesz wpisać kod JavaScript, aby uruchomić na bieżącej stronie.
Gdy już to zrobisz, kliknij Wykonać menu i wybierz Biegać. Kod działa w bieżącej zakładce.
Konsola internetowa zastępuje starą konsolę błędów, która jest przestarzała i zostanie usunięta w przyszłej wersji przeglądarki Firefox.
Konsola wyświetla cztery różne typy komunikatów, które można przełączać między widocznością: żądań sieci, komunikatów o błędach CSS, komunikatów o błędach JavaScript i komunikatów programistów WWW.
Co to jest wiadomość od programisty? Jest to wiadomość wydrukowana do obiektu window.console. Na przykład możemy uruchomić window.console.log ("Hello World"); Kod JavaScript w Brudnopisie, aby wydrukować wiadomość programisty na konsolę. Twórcy stron internetowych mogą zintegrować te wiadomości z ich kodem JavaScript, aby pomóc w debugowaniu.
Odśwież stronę, a zobaczysz wygenerowane żądania sieciowe i inne wiadomości.
Użyj pola wyszukiwania, aby filtrować wiadomości; kliknij żądanie, jeśli chcesz zobaczyć więcej szczegółów.
Od wersji Firefox 10 konsola internetowa może współpracować z Inspektorem stron. Zmienna $ 0 reprezentuje aktualnie wybrany obiekt w inspektorze. Na przykład, jeśli chcesz ukryć aktualnie wybrany obiekt, możesz go uruchomić $ 0.style.display = "none" w konsoli.
Jeśli chcesz dowiedzieć się więcej na temat korzystania z konsoli i jej wbudowanych funkcji, odwiedź stronę konsoli internetowej w witrynie Mozilla's Developer Network.
The Uzyskaj więcej narzędzi Opcja przeniesie Cię do kolekcji dodatków programisty Web Developer's Toolbox w witrynie Mozilla Add-Ons. Zawiera jedne z najlepszych dodatków dla twórców stron internetowych, w tym Firebug i Web Developer Toolbar.
Jeśli korzystasz z Firefoksa od kilku lat, możesz pamiętać o Inspektorze DOM. Zintegrowane narzędzia programistyczne Firefoksa przeszły długą drogę od tego czasu.
