Slik bruker du Inspect Element

Gaming

De fleste er uvitende om at det er en skattekiste av utviklerverktøy til disposisjon, og at den er skjult i favorittnettleseren deres.

Slik bruker du Inspect Element

Hver nettleser tilbyr utviklerverktøy for å sjekke ut kodingen av et nettsted, men det er en utenlandsk enhet for den gjennomsnittlige internettbrukeren. Tross alt, hvem ønsker å se på kodingen til et nettsted, ikke sant?

Som det viser seg, er det mange ting du kan lære ved å se på en nettsides koding. Les videre for å finne ut hva funksjonen for inspeksjonselementer har å tilby og hvordan du bruker den.

Slik bruker du Inspiser element i en bestemt nettleser

De fleste nettlesere har verktøy for å inspisere deler av et nettsted, men de fungerer generelt på samme måte.

Bruke Inspect Element i Google Chrome

  1. Åpne nettstedet du vil inspisere.

  2. Høyreklikk hvor som helst på siden og velg Undersøke.

    ELLER

  3. Klikk på de tre vertikale prikkene i høyre hjørne av verktøylinjen.

  4. Gå til Flere verktøy.

  5. Plukke ut Utviklerverktøy.

    ELLER

  6. trykk F12 hurtigtast på PC eller CMD + Options + I på en Mac.

Bruke Inspect Element i Microsoft Edge

  1. Åpne et nettsted.

  2. Klikk på de tre vertikale prikkene i øvre høyre hjørne av nettleserens verktøylinje.
  3. Rull ned og klikk på Flere verktøy.

  4. Klikk på Utviklerverktøy.

    ELLER

  5. Høyreklikk hvor som helst på nettstedet.
  6. Klikk på Undersøke.

    ELLER

  7. trykk Ctrl + Shift + I.

Enhver av disse tre metodene vil gi deg det samme resultatet.

Hvis du gjorde dette riktig, vil du se en ny rute som åpnes nederst i nettleseren din. Dette er utviklerverktøyene og inkluderer Elementer-fanen. Dette er verktøyet du trenger for å inspisere element.

Panelet åpnes nederst på skjermen som standard, men du kan alltid endre hvordan det vises. Følg disse enkle trinnene for å flytte utviklerverktøypanelet:

  1. Klikk på de tre vertikale prikkene i det øvre hjørnet av utviklerverktøy-panelet.

  2. Velg en dokkeside (venstre, bunn eller høyre) eller koble fra til et eget vindu.

Holder du markøren ved siden av kanten av panelrammen for Utviklerverktøy og drar, vil arbeidsområdet begrenses eller utvides. Hvis du for eksempel velger å forankre panelet til høyre side av nettleservinduet, kan du prøve å holde musepekeren på venstre kant. Du kan dra panelet for å endre størrelsen på det når du ser pilmarkøren.

Bruke Inspect Element (OS-spesifikk)

Selv om mange av trinnene som er involvert kan ha blitt dekket ved å bare vise deg hvordan du bruker Inspect Element i nettleseren, der det eksisterer i utgangspunktet, men vi vil vise deg hvordan på de fleste OS uansett.

Slik bruker du Inspect Element på en Chromebook

Standardnettleseren på en Chromebook er Google, så følg instruksjonene for Chrome-nettleseren for å få tilgang Inspisér element. Her er et lite oppfriskningskurs for deg:

  1. Åpne et nettsted.

  2. Klikk på de tre vertikale linjene i øvre høyre hjørne av verktøylinjen.

  3. Plukke ut Flere verktøy.

  4. Klikk på Utviklerverktøy.

Du kan også bruke høyreklikkmetoden eller F12 funksjonstast for å komme raskere til utviklerverktøyene.

Slik bruker du Inspect Element på en Android-enhet

Å kjøre Inspect Element på en Android-enhet er litt annerledes. Sjekk ut hvordan du kommer til Inspect Element-panelet på Android:

  1. trykk F12 funksjonstast.
  2. Velge Slå på enhetslinjen.

  3. Velg Android-enheten fra rullegardinmenyen.

Når du velger en spesifikk Android-enhet, vil du legge merke til at en mobilversjon av nettstedet lastes inn. Herfra kan du fritt bruke Inspect Element-funksjonen på Android-enheten din fra skrivebordet ditt.

Denne metoden fungerer for både Chrome- og Firefox-nettlesere fordi de har en funksjon i utviklerverktøyene deres kalt Device Simulation.

Det fungerer også på samme måte for iPhone-enheter. Du trenger bare å velge den riktige i rullegardinmenyen.

Slik bruker du Inspect Element i Windows

Inspect Element-verktøyet er ikke nødvendigvis OS-spesifikt, men er nettleserspesifikt. Det betyr at utviklerverktøy er en funksjon i nettleseren du bruker og ikke nødvendigvis Windows. Du kan imidlertid komme til Inspect Element-panelet uavhengig av hvilken nettleser du foretrekker.

Hvis du bruker Windows OS, vil du sannsynligvis også bruke Microsoft Edge-nettleseren. Sjekk ut hvordan du får tilgang til Inspect Element på MS Edge:

  1. Åpne nettstedet du vil inspisere.

  2. Trykk på de tre vertikale prikkene i hjørnet av nettleservinduet.

  3. Rull ned og velg Flere verktøy.

  4. Klikk på Utviklerverktøy.

Du kan også bruke F12 funksjonstast hvis du vil ha tilgang til Inspect Element raskere. Høyreklikk på nettsiden og velg Inspiser fungerer også.

Slik bruker du Inspect Element på en Mac

Hvis du bruker en Mac, er din valgte nettleser sannsynligvis Safari. Å åpne Inspect Elements på Safari er litt annerledes enn på Chrome og Firefox. Men det er like enkelt med disse trinnene:

  1. Åpne Safari-nettleseren.
  2. Klikk på Safari i overskriftsfanen.
  3. Plukke ut Preferanser fra rullegardinmenyen.
  4. Klikk på Avansert tannhjulikonet øverst på skjermen.
  5. Merk av i boksen som sier Vis Utvikle-menyen i menylinjen.

Å gå gjennom disse trinnene aktiverer funksjonen Inspiser element i nettleseren din. Hvis du ikke aktiverer Inspect Element først, vil du ikke se alternativet når du åpner et nettsted.

Etter at du har fullført dette trinnet, høyreklikker du bare på en hvilken som helst åpen nettside og velger Inspiser. Du kan også bruke hurtigtastkommandoen: CMD + Option + I (undersøke).

Slik bruker du Inspect Element på en iPhone

Vil du bruke funksjonen Inspiser elementer for å se hvordan en mobilversjon av en nettside vises på en iPhone? Du kan gjøre dette og mer med bare noen få enkle trinn. Men før du ser på et element, må du aktivere Webinspektør for iOS-enheten din:

  1. Gå til Innstillinger.

  2. Velg nå Safari.

  3. Rull til bunnen og trykk på Avansert meny.

  4. Trykk nå på vippebryteren for å slå på Webinspektør.

Du må også sørge for at Utvikle-menyen er aktivert på din Mac:

  1. Åpne Safari.
  2. Plukke ut Safari fra de øverste overskriftene.
  3. Klikk deretter på Preferanser.
  4. Klikk deretter på Avansert.
  5. Merk av i boksen som sier Vis Utvikle-menyen i menylinjen.

Etter å ha aktivert både iOS-mobilenhet og Mac, vil du se Utvikle-menyen i topplinjen på Mac-en. Klikk på den for å se den tilkoblede iPhonen og nettsiden som er aktiv på enheten. Hvis du velger nettsiden, åpnes også et Web Inspector-vindu for den samme siden på Mac-skjermen.

Husk imidlertid at disse instruksjonene bare fungerer for Safari som kjører en Mac, ikke Safari på Windows.

Slik bruker du Inspiser element i Google Forms

Du kan også bruke Inspiser-elementet på Google Forms. Men hvis du leter etter svar på en quiz, er du uheldig. Du finner ikke svarene innebygd i kodingen. Du kan bare se svar hvis du er oppretteren eller redaktøren av skjemaet. Uansett, hvis du er en student som svarer på en quiz på Google Forms, vil du bare se dine egne svar.

  1. Du kan høyreklikke på skjemaet og velge Undersøke for å se all koden for skjemaet.

Slik bruker du Inspiser element når det er blokkert

Noen ganger vil du oppdage at du ikke kan inspisere en nettside, og Inspiser-utvalget er nedtonet hvis du prøver å høyreklikke på det. Du tror kanskje at det er blokkert, men det er mange måter rundt dette:

Metode 1 – Slå av Javascript

  1. Gå inn til Innstillinger.

  2. Søk "JavaScript”.

  3. Slå av JavaScript.

Metode 2 – Få tilgang til utviklerverktøy den lange veien

I stedet for å høyreklikke på musen for å inspisere, gjør du dette:

  1. Gå til Innstillinger i nettleseren din.

  2. Plukke ut Flere verktøy.

  3. Rull ned og klikk på Utviklerverktøy.

Metode 3 – Bruke funksjonstasten

Du kan også prøve å bruke F12 funksjonstast på nettsider som blokkerer høyreklikk for Inspiser.

Du må kanskje prøve alle disse metodene før du finner en som fungerer for deg. Som en siste utvei kan du også prøve å se kildekoden ved å skrive inn view-source: [skriv inn hele url]. Wikipedia vis-kildeside

Slik bruker du Inspiser element på Discord

Å sjekke ut kodingen din på Discord er en enkel prosess. Bare bruk Ctrl + Shift + I kommando eller F12 tasten på en Discord-side.

Slik bruker du Inspect Element på en skole-Chromebook

Hvis Chromebooken din ble utstedt av en skole, innebærer bruk av funksjonen Inspiser element noen få enkle trinn:

  1. Høyreklikk eller trykk med to fingre på nettsiden og velg Undersøke.
  2. trykk Ctrl + Shift + I.
  3. Prøv å bruke view-source:[url]-metoden, for eksempel "view-source://www.wikipedia.com", uten anførselstegn.

Noen skoler og organisasjoner blokkerer imidlertid denne funksjonen. Så hvis det ikke fungerer for deg, må du kanskje ta kontakt med organisasjonen eller skoleadministratoren din.

Slik bruker du Inspiser element for å finne svar

Du kan bruke Inspect Element for å finne svar på en rekke ting som:

  1. Forhåndsvisning av nettsteddesign på mobile enheter.
  2. Finn ut søkeord som konkurrenter bruker.
  3. Hastighetstester.
  4. Endre tekst på en nettside.
  5. Finn raske eksempler for å vise utviklere hva du trenger.

Når du starter Inspect Element-panelet, vil du se all kodingen for nettstedet. Det inkluderer all JavaScript, CSS og HTML-koding som er innebygd i den. Det er som å se kildekoden til en nettside, bortsett fra at du kan gjøre endringer i koden. I tillegg får du se eventuelle endringer implementert i sanntid.

Dette verktøyet gjør det uvurderlig for markedsførere, designere og utviklere å se eventuelle designendringer før de fullføres. Å gjøre endringer i koding med Inspect Element varer imidlertid ikke evig. Når du laster inn siden på nytt, vil den gå tilbake til standardtilstanden.

Ytterligere vanlige spørsmål

Hvordan bruker jeg kommandoen Inspiser element for å finne svar?

Den eneste måten å finne svar ved å bruke Inspiser element-funksjonen er hvis nettstedet avslører det umiddelbart etter innsending. I dette tilfellet er svar til stede i kodingen.

Ellers ser du ganske enkelt kodingen for quizen eller testen når du bruker funksjonen Inspiser element, samt eventuelle svar du sender inn.

Er Inspiser Element ulovlig?

Nei, Inspect Element-verktøyet er ikke ulovlig, det er designet for webutviklere. Å se kildekoden for et nettsted er ikke ulovlig, det blir bare et problem hvis du bruker informasjonen som samles inn til ondsinnede formål, som å forsøke utnyttelse osv.

Er det mulig å deaktivere Inspiser element i nettleseren?

Det korte svaret er nei.

Du kan ikke deaktivere Inspect Element i en nettleser. Men du kan angi parametere som hindrer brukere i å gjøre visse handlinger som å høyreklikke på en nettside. Det er mange opplæringsprogrammer på nettet for å sette de riktige skriptene for å deaktivere visse hendelser. Du kan imidlertid ikke deaktivere Inspiser Element-funksjonen i sin helhet.

Bli kjent med innmaten til en nettside

Å sjekke ut Inspect Element-funksjonen på en nettside er sannsynligvis et utviklerverktøy du aldri visste at du trengte – selv om du ikke er en utvikler selv. Den har tonnevis av design- og markedsføringsapplikasjoner som kan få nettstedet ditt til å fungere jevnere. Og kanskje gi deg et forsprang på en konkurrent.

Hva bruker du Inspect Element til? Fortell oss om det i kommentarfeltet nedenfor.