Google Chrome: Čo je zobrazenie zdrojového kódu stránky?

V ponukách Chrome a Chromium je uvedený „Zobraziť zdroj stránky“. To umožňuje vývojárom a používateľom dozvedieť sa, čo sa deje pod kapotou, keď sa stránka načíta do prehliadača. Je to okno do zložitosti HTML, CSS a JavaScriptu, ktoré tvoria webové stránky, ktoré denne prehliadate.

Definovanie zdroja zobrazenia stránky v prehliadači Chrome

Možnosť Zobraziť zdrojový kód stránky pomáha vývojárom rozoberať a ladiť webovú stránku a umožňuje nadšencom nahliadnuť do stavebných blokov webových stránok.

Zobrazenie zdrojového kódu vám umožňuje vidieť každú zložku webovej stránky (HTML), spôsob jej spracovania (CSS) a interakcie s kódovaním, ktoré to všetko spájajú (JavaScript). Tento podrobný pohľad je neoceniteľný pri riešení problémov. Vyskytol sa problém s rozložením? Kontrola zdroja stránky môže odhaliť chýbajúcu značku. Nereaguje tlačidlo? Sekcia JavaScript môže obsahovať odpoveď.

Nemôžete zmeniť kód, otestovať ho ani zobraziť ukážku akýchkoľvek zmien, ako je to pri použití možnosti Inspect (DevTools) . Ponúka však rýchly pohľad na identifikáciu všetkého, čo potrebujete, či už na vzdelávacie, ladiace alebo výskumné účely.

Ako získať prístup k zdrojovému kódu webovej stránky v prehliadači Chrome

Existujú dva spôsoby prístupu k zdrojovému kódu webovej stránky v prehliadačoch Chrome a Chromium. Pre stránky chránené pravým tlačidlom myši funguje iba jedna metóda. Začnime.

Pomocou možnosti ponuky „Zobraziť zdroj stránky“.

Táto možnosť predstavuje najjednoduchší spôsob kontroly zdrojového kódu webovej stránky a funguje pre každú stránku online.

1. Otvorte prehliadač Google Chrome alebo Chromium, napríklad Edge alebo Brave .
2. Prejdite na webovú stránku alebo webovú stránku, ktorá vás zaujíma.
3. Kliknite pravým tlačidlom myši na otvorenú oblasť, vyberte Zobraziť zdrojový kód stránky alebo stlačte Ctrl + U (Windows) alebo Command + U (Mac).
   
4. Zdrojový kód sa potom zobrazí na novej karte, ktorá pripomína rozloženie textového editora.

Pomocou možnosti adresy URL „zobraziť zdroj“.

1. Spustite prehliadač Google Chrome alebo prehliadač Chromium, napríklad Edge alebo Brave .
2. Prejdite na webovú stránku alebo webovú stránku, ktorá vás zaujíma.
3. Do panela s adresou napíšte view-source:[adresa URL webovej stránky tu] , ako napríklad:
   view-source:https://www.alphr.com.
   
4. Zdrojový kód sa potom zobrazí na novej karte, ktorá pripomína rozloženie textového editora.

Ak chcete získať podrobnejší prehľad o prístupe k tejto funkcii na iných zariadeniach, prečítajte si , ako zobraziť kód HTML v prehliadači Chrome.

Nekopírujte a nepoužívajte obsah zdrojového kódu stránky priamo

Pohľad na zdrojový kód webovej stránky je jednoduchý spôsob, ako získať prehľad o jej štruktúre a obsahu. Neposkytuje však pokročilejšie informácie, ako je ladenie alebo analýza výkonu. Okrem toho dynamický obsah generovaný JavaScriptom nemusí byť viditeľný v zdrojovom kóde.

Je dôležité si uvedomiť, že každá webová stránka je jedinečná a to, čo funguje pre jednu, nemusí fungovať pre druhú. Okrem toho môžete naraziť na zle optimalizované webové stránky, ktoré slúžia ako príklady toho, čo nerobiť.

často kladené otázky

Otázka: Je zmena kódu HTML, CSS a Java v možnosti Inspect bezpečná?

Odpoveď: V režime kontroly v prehliadači Chrome alebo Chromium môžete robiť čokoľvek. Nijakým spôsobom nemení webovú stránku. Úpravy v reálnom čase vykonávate iba pre náhľad stránky vľavo.

Otázka: Nie je možnosť „Zobraziť zdrojový kód“ stratou času?

Odpoveď: Nie, prezeranie zdrojového kódu umožňuje vývojárom pozrieť sa na existujúce inštrukcie HTML, CSS a Java, aby našli jednoduché problémy alebo mizerné kódovanie, než aby sa hrabali vo vývojovom nástroji. Je to možnosť rýchleho zobrazenia, rovnako ako funkcia rýchleho náhľadu súborov na počítači, kde neotvára iné programy. Okrem toho môžu ľudia skopírovať úryvky kódu a vložiť ich do nástroja na vývoj webových stránok.