Så här öppnar du webbläsarkonsolen på Chrome, Safari, Firefox och Edge
Den vanligaste anledningen till att användare vill öppna sin webbläsarkonsol är att identifiera problem med sidredigering, trasiga gränssnittselement, felaktiga block och andra typer av JavaScripts-fel och konflikter. Men varje webbläsare har sina egna genvägar och steg som i slutändan gör att du kan öppna konsolen och se baksidan av en webbsida som du besöker.
Eftersom det bara finns fyra olika webbläsare med mer än 5% marknadsandel (Chrome, Safari, Edge och Firefox) kommer vi att visa dig flera sätt att öppna konsolen på var och en av dem. Men kom ihåg att för varje webbläsare är elementen och felen i allmänhet färgkodade och märkta på olika sätt.
Hur man öppnar konsolen på Google Chrome
På Chrome finns det faktiskt tre olika sätt som gör att du kan öppna den inbyggda konsolen.
Oavsett vilken Chrome-version du använder kan du använda en av dessa genvägar för att öppna och stänga den inbyggda konsolen:
- F12
- Ctrl + Skift + J (Cmd + Alternativ + J på Mac)
Tänk på att samma genvägar också kan användas för att dölja konsolen. Som standard tar konsolen i Google Chrome exakt hälften av skärmen, men du kan enkelt justera förhållandet via skjutreglaget i mitten och webbläsaren kommer ihåg ändringen nästa gång du öppnar konsolen.
Om du vill fokusera på ett visst element kan du helt enkelt markera det med musen och högerklicka på det> Inspektera. Detta kommer att öppna upp Element flik och Stilar på konsolen, så att du kan fokusera på elementet till hands.
Du kan dock också komma åt konsolen via GUI-menyn i Google Chrome. För att göra detta klickar du bara på åtgärdsknappen i det övre högra hörnet och går till Fler verktyg> Utvecklarverktyg.
Om du vill arbeta så effektivt som möjligt, här är en lista över Chrome Console-genvägar som du kan använda.
Hur man öppnar konsolen på Google Microsoft Edge
Som alla andra webbläsare har Microsoft Edge också ett konsolverktyg som är avsett för utvecklare som gör interaktiv felsökning eller ad hoc-testning.
Det här verktyget loggar information som är kopplad till webbsidan som besöks. Du hittar information relaterad till Javascript, nätverksförfrågningar och säkerhetsfel.
Det enkla sättet att öppna konsolverktyget på Microsoft Edge är att använda den fördefinierade genvägen (F12-nyckel).
Men du kan också göra det via GUI-menyn genom att klicka på åtgärdsknapp (övre vänstra hörnet)> Fler verktyg> Utvecklarverktyg.
Och i likhet med funktionaliteten i de andra webbläsarna låter Microsoft Edge dig också inspektera specifika element med den inbyggda konsolen. För att göra detta, välj bara och högerklicka på ett element och välj Inspektera elementet.
Här är en lista med några användbara genvägar som du kan använda i den inbyggda konsolen i Microsoft Edge:
Startar konsolen i fokusläge | Ctrl + Flytta + J |
Växlar till konsolen | Ctrl + 2 |
Visa eller dölj konsolen från en annan DevTools-flik | Ctrl + ` (tillbaka kryss) |
Utför (kommando med en rad) | Stiga på |
Radbrytning utan att köra (kommando med flera rader) | Flytta + Stiga på ellerCtrl + Stiga på |
Rensa konsolen för alla meddelanden | Ctrl + L |
Filtrera loggar (ställa in fokus på sökrutan) | Ctrl + F |
Acceptera förslag för automatisk slutförande (när du är i fokus) | Stiga på ellerFlik |
Föregående / nästa förslag om automatisk slutförande | Uppåtpil/Nedåtpil |
Hur man öppnar konsolen på Mozilla Firefox
Den inbyggda konsolen på Mozilla Firefox fungerar lite annorlunda än de andra motsvarigheter som vi hittills har analyserat. Vad jag menar med detta är att det automatiskt öppnas i ett fristående fönster, snarare än att dela din webbläsarskärm i hälften.
Detta möjliggör en mer produktiv strategi för personer med andra skärmar men kan komma i vägen för användare som behöver arbeta med en liten skärm. (Om du befinner dig i det här scenariot kan du använda Alt + Tab-genvägen för att växla fram och tillbaka mellan Firefox och tillhörande webbläsarkonsol.
För att öppna den inbyggda webbläsarkonsolen på Mozilla Firefox har du tre alternativ:
- Du kan antingen använda den universella genvägen - Ctrl + Skift + J (eller Cmd + Skift + J på en Mac)
- Du kan öppna den från åtgärdsmenyn - genom att klicka på åtgärdsmenyn> Webutvecklare> Webbläsarkonsol.
- Eller så kan du tvinga webbläsarkonsolen att öppna direkt genom att starta Firefox från kommandoraden och skicka argumentet ”-jsconsole”:
/Applications/FirefoxAurora.app/Contents/MacOS/firefox-bin -jsconsole
Notera: Firefox innehåller också en webbkonsol, som liknar webbläsarkonsolen men den används på en enda innehållsflik istället för på hela webbläsaren.
Hur man öppnar konsolen på Google Safari
Till skillnad från alla andra webbläsare som vi har tittat på hittills är Felkonsolen på Safari inaktiverad som standard. På grund av detta måste du göra ett extra steg för att aktivera det i din webbläsare.
För att göra detta, öppna Safari och klicka på Inställningar flik. När du väl är inne i Inställningar klicka på fliken Avancerat och markera rutan som är associerad med Visa utveckla menyn i menyraden.
Nu när du har gjort konsolen synlig kan du öppna den genom att öppna Utveckla fliken högst upp och klicka på Visa felkonsol.
Tänk på att Safari har ett dynamiskt sätt att visa felkonsolen. Om fönstret är litet när du öppnar konsolen ser du det i ett helt annat fönster.
Om du vill öppna konsolen i samma fönster som din sida måste du se till att webbläsarfönstret är av full storlek innan du öppnar felkonsolen.