Hvordan inspisere element på iPhone: Alt du trenger å vite

I tilfelle du ikke vet det, består en nettside av en rekke elementer som er formatert for å vises som én enkelt enhet. Webutviklere er pålagt å forstå hvert av disse elementene, hvordan de er lagt ut på en nettside, og se hvordan hver enkelt av dem fungerer på egen hånd.

Windows- og Mac-brukere vil være kjent med alternativet "Inspiser" eller "Inspiser element" som er tilgjengelig når du høyreklikker på en hvilken som helst nettside. Det dette alternativet tilbyr er en måte å vise et nettsteds kildekode, se alle elementene, kodelinjen bak hver av dem, og redigere Javascript, HTML, CSS og alle de andre mediefilene som er på den. På denne måten får du ikke bare lære hvordan et bestemt nettsted fungerer og fungerer, men du kan gjøre endringer på det i din egen nettleser uten at de påvirker selve nettsiden. 

Selv om inspeksjonsalternativet er kjent for å være et "utviklerverktøy", men det er ikke bare utviklere som drar nytte av det. Selv nybegynnere og ikke-utviklere kan bruke dette verktøyet til å lære hvordan et nettsted er bygget og hvordan hvert av elementene fungerer samlet. Hvis du ser frem til å bruke alternativet inspiser element når du surfer på nettet på en iPhone, bør dette innlegget hjelpe deg med å finne en måte å gjøre det på. 

Relatert: Hvordan inspisere element på Android

Kan du inspisere webelementer direkte på Safari?

Det enkle svaret er nei. Safari på iOS, som mange andre mobile nettlesere, tilbyr deg ikke et innebygd inspeksjonsverktøy for å se utviklingen av en nettside. Apple gir ingen grunn til hvorfor det ikke er et slikt alternativ, men vi tror det har å gjøre med hvor små skjermer er på smarttelefoner. En mindre skjermstørrelse kan gjøre det vanskeligere for brukere å navigere rundt i boksene som blir inspisert, da du kanskje må plassere markøren forsiktig når du vil redigere en nettsides kode eller til og med finne en. 

En annen grunn til dette kan være mangelen på datakraft på smarttelefoner. Selv om moderne iPhones har nok kraft til å kjøre grafikkintensive spill, kan det være vanskelig å se sideinformasjonen til et nettsted siden ikke alle nettsteder er skapt like. Noen nettsteder kan ha mange ressurser og lag som er nøye utformet for å få det til å se sømløst ut, men de samme ressursene kan ta litt tid å laste opp når de blir inspisert. 

Relatert: Sløyfe en video på iPhone [veiledning]

Inspiser Element på iPhone: Hvilke andre alternativer har du?

Selv om du ikke kan bruke "Inspiser element"-verktøyet på Safari-appen på iOS, er det fortsatt måter å omgå denne begrensningen på. Nedenfor finner du tre måter du kan inspisere elementer på nettsider du besøker på Safari på iPhone. 

Metode #01: Bruke Safari på Macen

Hvis du eier en macOS-enhet i tillegg til iPhone, kan du fortsatt inspisere nettsider direkte fra Safari-appen, men på Mac. Apple lar deg feilsøke nettsider fra Safari på iOS på samme måte som du ville gjort på Macen ved å bruke "Utvikle"-verktøyene. Selv om prosessen med å feilsøke et nettsted er relativt enkel, kan det innledende oppsettet være lengre enn du kan forvente. Men ikke bekymre deg, vi vil forklare oppsettsprosessen på enklest mulig måte og hjelpe deg med å inspisere sider med letthet etter første gang. 

Aktiver Web Inspector på iOS

For å kunne feilsøke nettelementer, må du først aktivere Web Inspector for Safari-appen på iOS. For å gjøre dette, åpne Innstillinger-appen og velg "Safari".

Hvordan inspisere element på iPhone: Alt du trenger å vite

Inne i Safari, bla ned og trykk på "Avansert". 

Hvordan inspisere element på iPhone: Alt du trenger å vite

På neste skjerm trykker du på bryteren ved siden av 'Web Inspector' til den blir grønn. 

Hvordan inspisere element på iPhone: Alt du trenger å vite

Første oppsett på Mac

Når du har aktivert Web Inspector for Safari på iOS, er det nå på tide å få konfigureringen gjort på Mac-en. På Mac, åpne Safari-programmet, klikk på "Safari"-alternativet fra menylinjen og velg "Preferences". 

Hvordan inspisere element på iPhone: Alt du trenger å vite

I vinduet som vises, velg "Avansert"-fanen fra toppen og merk av for "Vis utviklingsmenyen i menylinjen". 

Hvordan inspisere element på iPhone: Alt du trenger å vite

Du skal nå se "Utvikle"-alternativet vises på menylinjen øverst. 

Hvordan inspisere element på iPhone: Alt du trenger å vite

Nå, bruk USB-kabelen som fulgte med iPhone, opprette en forbindelse mellom iPhone og Mac. Når din iPhone blir koblet til Mac, kan du klikke på "Utvikle" på menylinjen og se om din iPhone vises i listen over enheter. Hvis ja, klikk på enhetsnavnet fra denne listen. 

Hvordan inspisere element på iPhone: Alt du trenger å vite

For å være sikker på at du kan inspisere nettsider trådløst uten å kreve en USB-kabel som du gjorde akkurat nå, klikker du på "Koble til via nettverk" når iPhone-menyen åpnes. 

Hvordan inspisere element på iPhone: Alt du trenger å vite

Nå kan du koble iPhone fra Mac og du vil fortsatt kunne inspisere nettsider uten å koble til en kabel mellom dem. 

Inspiser nettsider fra iOS på en Mac

Nå som du har aktivert 'Koble til via nettverk' på 'Utvikle'-menyen, kan du inspisere nettsider fra Safari på iOS direkte på din Mac. Du trenger bare å sørge for at både iPhone og Mac er koblet til det samme trådløse nettverket for å kunne feilsøke nettsider trådløst. 

For dette, åpne Safari-appen på iPhone og gå til nettsiden du vil inspisere. 

Med iPhone-en din ulåst og den valgte nettsiden åpen, gå over til Mac-en og åpne Safari-applikasjonen der. Her klikker du på 'Utvikle' fra menylinjen og går til 'iPhone'. 

Hvordan inspisere element på iPhone: Alt du trenger å vite

Når du holder musepekeren over "iPhone", bør du se en liste over nettsider som er åpne på iOS. Klikk på nettsiden du vil inspisere fra denne listen. 

Hvordan inspisere element på iPhone: Alt du trenger å vite

Et nytt vindu vil lastes opp på Mac-en som viser all informasjonen som kan inspiseres fra den valgte nettsiden. 

Hvordan inspisere element på iPhone: Alt du trenger å vite

Når som helst under inspeksjonen din, vil du kunne se hvilken del av siden en kodelinje peker til ved å se etter et blått område på din iPhone.

Hvordan inspisere element på iPhone: Alt du trenger å vite

Dette blå området indikerer at koden du holder over på Mac-en er det som utgjør det uthevede elementet for denne nettsiden. Flytting mellom forskjellige kodelinjer vil flytte dette blå høydepunktet over forskjellige deler av siden på iPhone-en din i sanntid. 

Relatert: Hvordan beholde effekter i FaceTime

Metode #02: Bruke snarveier på iOS 

Hvis du ikke eier en Mac eller vil ha en sniktitt på et nettsted direkte fra iPhone, så vil du gjerne vite at iOS-snarveier-appen for dette. Snarveier-appen på iOS tilbyr en haug med forhåndslagde valg som lar deg se en sides kildekode, redigere en nettside, hente bilder fra et nettsted og se etter eldre versjoner av en nettside fra Safari-appen. Dessverre er det ingen enkelt snarvei som tilbyr fullverdig webfeilsøking på iOS, så du må legge til en snarvei for hvert av disse formålene. 

Vi fant følgende snarveier som du kan bruke til å utføre feilsøking på nettsteder direkte fra iOS. Disse er:

Vis kilde – Denne snarveien lar deg se kildekoden til en nettside i basisbeinformat. 

Hvordan inspisere element på iPhone: Alt du trenger å vite

Rediger nettside – Denne snarveien lar deg redigere innholdet på en nettside lokalt, slik at du kan teste et nytt design eller format og hvordan det kan se ut på din iPhone. 

Hvordan inspisere element på iPhone: Alt du trenger å vite

Få bilder fra siden – En primær grunn til å inspisere en side kan være å se på bilder eller lagre de som ellers ikke er interaktive. Denne snarveien henter alle bildene fra en bestemt nettside og forhåndsviser dem deretter samlet. Som skjermbildet nedenfor viser, kan du se hvert eneste av de 24 bildene som ligger på den valgte nettsiden. 

Hvordan inspisere element på iPhone: Alt du trenger å vite

Wayback Machine – Denne snarveien tar deg til en nettsides Wayback Machine hvor du kan se tidligere versjoner som forblir lagret på Internett-arkivet. 

Avhengig av hvordan du vil inspisere nettsider på iOS, kan du legge til hvilken som helst av disse snarveiene til iPhone ved enten å klikke på de relevante koblingene ovenfor eller søke etter dem i Snarveier > Galleri. 

Hvordan inspisere element på iPhone: Alt du trenger å vite

I søkeresultatene trykker du på snarveien du vil legge til iPhone. 

Hvordan inspisere element på iPhone: Alt du trenger å vite

Når en forhåndsvisningsskjerm åpnes, trykker du på alternativet "Legg til widget" nederst. 

Hvordan inspisere element på iPhone: Alt du trenger å vite

Snarveiene dere alle vil vises på skjermen Mine snarveier > Alle snarveier, og de vil også være tilgjengelige i Safaris Share-ark.  

Hvordan inspisere element på iPhone: Alt du trenger å vite

For å inspisere en nettside, åpne den på Safari og trykk på "Del"-knappen nederst. 

Hvordan inspisere element på iPhone: Alt du trenger å vite

I Del-arket som vises, blar du ned og finner snarveiene du la til iPhone. 

Hvordan inspisere element på iPhone: Alt du trenger å vite

Ved å velge 'Rediger webside' kan du direkte redigere deler av nettsiden. Når du velger noen av de tre andre alternativene, vil du bli spurt om du vil at snarveien skal få tilgang til nettsiden. Her trykker du på 'Tillat en gang'. 

Hvordan inspisere element på iPhone: Alt du trenger å vite

Relatert: Slik legger du til WidgetSmith på startskjermen

Metode #03: Bruke tredjepartsapper

Hvis du ikke er fornøyd med resultatene ovenfor, må du utforske tredjepartsapper for å kunne inspisere elementer på en nettside. I likhet med Safari, vil du ikke finne en måte å inspisere en nettside i de mest populære nettleserne (Chrome, Firefox, Brave, etc.). I stedet må du stole på en app som er laget for å utføre denne spesifikke oppgaven, og apper som disse kan være vanskelige å finne.

Selv om et enkelt søk i App Store vil gi deg flere resultater for inspeksjon av nettelementer, vil du ikke finne så mange apper som er tilgjengelige gratis og er vurdert høyt. Basert på tilbakemeldinger fra brukere, anbefaler vi at du installerer Inspect Browser- eller Gear Browser-  apper fra App Store, som gir elementinspeksjon og redigering på JavaScript, CSS og HTML. 

Det er alt du trenger å vite om å inspisere elementer på en iPhone. 

I SLEKT


Leave a Comment

LastPass: En feil oppstod under tilkobling til serveren

LastPass: En feil oppstod under tilkobling til serveren

Hvis LastPass ikke klarer å koble til serverne, tøm den lokale bufferen, oppdater passordbehandleren og deaktiver nettleserutvidelsene dine.

Hvordan endre brukeragent i Safari

Hvordan endre brukeragent i Safari

Finn her detaljerte instruksjoner om hvordan du endrer brukeragentstrengen i Apple Safari-nettleseren for MacOS.

3 trinn for å integrere ChatGPT i Word

3 trinn for å integrere ChatGPT i Word

Lurer du på hvordan du integrerer ChatGPT i Microsoft Word? Denne guiden viser deg nøyaktig hvordan du gjør det med ChatGPT for Word-tillegget i 3 enkle trinn.

Hvordan kaste Microsoft Teams til TV

Hvordan kaste Microsoft Teams til TV

Microsoft Teams støtter for tiden ikke direkte casting av møter og samtaler til TV-en din. Men du kan bruke en skjermspeilingsapp.

Hvordan konvertere RAR-fil til ZIP i Windows

Hvordan konvertere RAR-fil til ZIP i Windows

Har du noen RAR-filer som du vil konvertere til ZIP-filer? Lær hvordan du konverterer RAR-filer til ZIP-format.

24H2 Oppdatering Bryter Auto HDR – Dette Er Hva Du Kan Gjøre Med Det

24H2 Oppdatering Bryter Auto HDR – Dette Er Hva Du Kan Gjøre Med Det

For mange brukere bryter 24H2-oppdateringen auto HDR. Denne guiden forklarer hvordan du kan fikse dette problemet.

Deaktiver Apple Software Update-skjerm på Windows 11 og macOS

Deaktiver Apple Software Update-skjerm på Windows 11 og macOS

Ønsker du å deaktivere Apple Software Update-skjermen og hindre den fra å vises på Windows 11-PC-en eller Mac-en din? Prøv disse metodene nå!

Hvordan fikse skjermblinking i Google Chrome på Windows

Hvordan fikse skjermblinking i Google Chrome på Windows

Lær hvordan du løser et vanlig problem der skjermen blinker i Google Chrome-nettleseren.

Hvordan tømme hurtigminnet i Google Chrome

Hvordan tømme hurtigminnet i Google Chrome

Hold hurtigminnet i Google Chrome-nettleseren ren med disse trinnene.

Spotify: Deaktiver automatisk oppstart

Spotify: Deaktiver automatisk oppstart

Spotify kan bli irriterende hvis det åpner seg automatisk hver gang du starter datamaskinen. Deaktiver automatisk oppstart ved å følge disse trinnene.