Den webside, du læser, består bl.a. af kildekoden. Det er de oplysninger, din webbrowser henter og oversætter til det, du læser lige nu.
De fleste webbrowsere giver mulighed for at se kilden til en webside uden yderligere software, uanset hvilken type enhed du er på.
Nogle tilbyder endda avanceret funktionalitet og struktur, hvilket gør det nemmere at gennemgå HTML og anden programmeringskode på siden.
Hvorfor vil du se kildekoden?
Der er flere grunde til, at du måske vil se en sides kildekode. Hvis du er en webudvikler, kan du måske tage et kig under afdækningerne på en anden programmørs særlige stil eller implementering. Måske har du kvalitetssikring og forsøger at finde ud af, hvorfor en bestemt del af en webside gengiver eller opfører sig som den er.
Du kan også være en nybegynder, der forsøger at lære at kode dine egne sider og søger nogle eksempler på virkelige verdener. Selvfølgelig er det muligt, at du ikke falder ind i nogen af disse kategorier og bare vil se kilden ud af ren nysgerrighed.
Nedenstående er vejledninger til, hvordan du kan se kildekoden i din valgte browser.
Google Chrome
Kører på: Chrome OS, Linux, MacOS, Windows
Desktop-versionen af Chrome tilbyder tre forskellige metoder til visning af en sides kildekode, den første og enkleste ved at bruge følgende tastaturgenvej: CTRL + U (KOMMANDO + OPTION + U på macOS).
Når der trykkes, åbner denne genvej en ny browserfane, der viser HTML og anden kode for den aktive side. Denne kilde er farvekodet og struktureret på en måde, der gør det lettere at opdele og finde det, du leder efter. Du kan også komme derhen ved at indtaste følgende tekst i Chrome adresselinje, vedhæftet til venstre på websides webadresse og vælge Gå ind nøgle: se kilde: (dvs. visning-kilde: https: //www.Go-Travels.com).
Den tredje metode er via Chrome's udviklerværktøjer, som giver dig mulighed for at tage et dybere dykke ind i sidens kode samt at tilpasse det til test og udviklingsformål. Udviklerens værktøjer kan åbnes og lukkes ved hjælp af denne tastaturgenvej: CTRL + SHIFT + I (KOMMANDO + OPTION + I på macOS). Du kan også starte dem ved at tage følgende vej.
-
Vælg Chromes hovedmenuknap, der er placeret øverst i højre hjørne og repræsenteret af tre lodret orienterede prikker.
-
Når rullemenuen vises, skal du holde musemarkøren hen over Flere værktøjer mulighed.
-
Når undermenuen vises, skal du vælge Udvikler værktøjer.
Android
At se en websides kilde i Chrome til Android er så enkel som at tilføje følgende tekst til forsiden af adressen (eller URL) og indsende den: se kilde:. Et eksempel på dette ville være vis-kilde: https: //www.Go-Travels.com . HTML og anden kode fra den pågældende side vises øjeblikkeligt i det aktive vindue.
iOS
Selv om der ikke findes nogen indfødte metoder til visning af kildekode ved hjælp af Chrome på din iPad, iPhone eller iPod touch, er det enkleste og mest effektive at bruge en tredjepartsløsning, som f.eks. View Source-appen.
Tilgængelig for $ 0,99 i App Store, beder Vis kilde dig om at indtaste webadressens URL (eller kopiere / indsætte den fra Chrome adresselinje, som undertiden er den enkleste vej at tage), og det er det. Ud over at vise HTML og anden kildekode har appen også faner, der viser individuelle sideaktiver, dokumentobjektmodellen (DOM), sideformat, cookies og andre interessante oplysninger.
Microsoft Edge
Kører på: Windows
Edge-browseren giver dig mulighed for at se, analysere og endda manipulere den aktuelle sides kildekode gennem dens grænseflade til udviklerværktøjer. For at få adgang til dette praktiske værktøjssæt kan du bruge en af disse tastaturgenveje: F12 eller CTRL + U. Hvis du foretrækker musen i stedet, skal du klikke på kantens menuknap (tre prikker placeret øverst til højre) og vælge F12 Developer Tools mulighed fra listen.
Efter at dev-værktøjerne køres for første gang, tilføjer Edge to ekstra muligheder til browserens kontekstmenu (tilgængelig ved at højreklikke overalt på en webside): Undersøg elementet og Se kilde, den sidstnævnte, der åbner Debugger del af dev tools-grænsefladen befolket med kildekoden.
Mozilla Firefox
Kører på: Linux, MacOS, Windows
For at se en sides kildekode i desktopversionen af Firefox kan du trykke på CTRL + U (COMMAND + U på macOS) på dit tastatur, som åbner en ny fane indeholdende HTML og anden kode for den aktive webside.
Hvis du skriver følgende tekst i Firefox adresselinje direkte til venstre for sidenes webadresse, vil den samme kilde blive vist i den aktuelle fane i stedet: se kilde: ( dvs. se-kilde: https: //www.dotdash.com ).
En anden måde at få adgang til en sides kildekode på er via Firefox's udviklerværktøjer, der er tilgængelig ved at tage følgende trin.
-
Vælg hovedmenuknappen, der er placeret i øverste højre hjørne af dit browservindue og repræsenteret af tre vandrette linjer.
-
Når pop-out menuen vises, skal du klikke på knappen Udvikler "svensknøgle" ikon.
-
Webudviklerens kontekstmenu skal nu være synlig. Vælg Side Kilde mulighed.
Firefox lader dig også se kildekoden for en bestemt del af en side, hvilket gør det nemt at isolere problemer. For at gøre det skal du først markere det område, du er interesseret i med musen. Højreklik derefter på og vælg Se valgkilde fra browserens kontekstmenu.
Android
Visning af kildekode i Android-versionen af Firefox kan opnås ved at prefixe websidernes URL med følgende tekst: se kilde:. Hvis du f.eks. Vil se HTML-kilden til Dotdash, skal du indsende følgende tekst i browserens adresselinje: vis-kilde: https: //www.dotdash.com .
iOS
Vores anbefalede metode til visning af webside kildekode på din iPad, iPhone eller iPod touch er gennem View Source-appen, der er tilgængelig i App Store for $ 0.99. Selvom det ikke er integreret direkte med Firefox, kan du nemt kopiere og indsætte en webadresse fra browseren til appen for at afsløre HTML og anden kode, der er knyttet til den pågældende side.
Apple Safari
Kører på iOS og macOS
iOS
Selvom Safari til iOS ikke indeholder evnen til at se sidekilden som standard, integreres browseren temmelig problemfrit med View Source-appen, der er tilgængelig i App Store for $ 0.99.
Når du har installeret denne tredjepartsapp, vender du tilbage til Safari-browseren og klikker på knappen Share, der findes nederst på skærmen og repræsenteret af en firkant og en pil op. IOS-aktiearket skal nu være synligt og overlejre den nederste halvdel af dit Safari-vindue. Rul til højre og vælg Se kilde knap.
En farvekodet, struktureret repræsentation af den aktive sides kildekode skal nu vises sammen med andre faner, som giver dig mulighed for at se sideaktiver, scripts og meget mere.
MacOS
For at få vist kilden til en side i desktopversionen af Safari, skal du først aktivere den Udvikle menu. Trinene nedenfor går igennem ved at aktivere denne skjulte menu og vise en sides HTML-kilde.
-
Vælg Safari i browsermenuen, der er placeret øverst på skærmen.
-
Når rullemenuen vises, skal du vælge Indstillinger mulighed.
-
Safari-indstillingerne skal nu være synlige. Klik på Fremskreden ikonet placeret øverst til højre på øverste række.
-
Mod bunden af afsnittet Avanceret er en indstilling mærket Vis udvikle menuen i menulinjen, ledsaget af en tom afkrydsningsfelt. Marker denne boks en gang for at placere en markering i den, og luk vinduet Indstillinger ved at klikke på den røde 'x', der findes øverst i venstre hjørne.
-
Vælg Udvikle menuen, der er placeret øverst på skærmen.
-
Når rullemenuen vises, skal du vælge Vis side kilde. Du kan også bruge følgende tastaturgenvej i stedet: KOMMANDO + OPTION + U.
Opera
Kører på: Linux, MacOS, Windows
Hvis du vil se kildekoden fra den aktive webside i Opera-browseren, skal du bruge følgende tastaturgenvej: CTRL + U (KOMMANDO + OPTION + U på macOS). Hvis du foretrækker at indlæse kilden i den aktuelle fane i stedet, skal du skrive følgende tekst til venstre for sidens URL i adresselinjen og trykke på Indtast: Vis-kilde: ( det vil sige se-kilde: https: //www.Go-Travels.com ).
Den desktop version af Opera giver dig også mulighed for at se HTML-kilde, CSS og andre elementer ved hjælp af dens integrerede udvikler værktøjer. Hvis du vil starte denne grænseflade, som som standard vises på højre side af dit hovedbrowser vindue, skal du trykke på følgende tastaturgenvej: CTRL + SHIFT + I (KOMMANDO + OPTION + I på macOS).
Operas udvikler værktøjssæt er også tilgængelig ved at tage følgende trin.
-
Vælg Opera-logoet, der findes øverst til venstre i dit browservindue.
-
Når rullemenuen vises, skal du holde musemarkøren hen over Flere værktøjer mulighed.
-
Klik på Vis udvikler menu.
-
Vælg Opera-logoet igen.
-
Når rullemenuen vises, skal du svinge markøren over Udvikler.
-
Når undermenuen vises, skal du vælge Udvikler værktøjer.
Vivaldi
Der er flere måder at få vist sidekilden i Vivaldi-browseren på. Den enkleste er via CTRL + U tastaturgenvej, der præsenterer kode fra den aktive side i en ny fane.
Du kan også tilføje følgende tekst til forsiden af sidens URL, som viser kildekoden i den nuværende fane: se kilde:. Et eksempel på dette ville være view-source: http: //www.dotdash.com .
En anden metode er gennem browserens integrerede udvikler værktøjer, tilgængelig ved at trykke på CTRL + SHIFT + I kombination eller gennem Udvikler værktøjer mulighed i browserens Værktøj menu - fundet ved at vælge V logo i øverste venstre hjørne. Brug af dev-værktøjerne muliggør en langt mere dybtgående analyse af sidens kilde.
