Svetainę, kurią skaitote, sudaro, be kita ko, šaltinio kodas. Tai yra jūsų žiniatinklio naršyklės įkėlimo ir vertimo informacija, kurią dabar skaitote.
Dauguma interneto naršyklių suteikia galimybę pamatyti svetainės šaltinio kodą be papildomos reikalingos programinės įrangos, nesvarbu, kokio tipo įrenginys esate.
Kai kurie net siūlo išplėstinę funkciją ir struktūrą, kad būtų lengviau suprasti HTML ir kitą programavimo kodą puslapyje.
Kodėl norėtumėte pamatyti šaltinio kodą?
Yra keletas priežasčių, dėl kurių galbūt norėsite pamatyti puslapio šaltinio kodą. Jei esate žiniatinklio kūrėjas, galbūt norėtumėte žvilgtelėti po viršeliais pagal kitą programuotojo specialų stilių ar įgyvendinimą. Galbūt esate kokybės užtikrinimo srityje ir bandote išsiaiškinti, kodėl tam tikra dalis tinklalapio atvaizduoja arba elgiasi taip, kaip ji yra.
Jūs taip pat galite būti pradedančiuoju, norinčiu išmokti koduoti savo puslapius ir ieškoti realių pavyzdžių. Žinoma, yra įmanoma, kad jūs nepateksite į bet kurią iš šių kategorijų ir norite pamatyti šaltinį tik nuo smalsumo.
Toliau pateikiami nurodymai, kaip peržiūrėti šaltinio kodą pasirinktoje naršyklėje.
"Google Chrome"
Veikia: "Chrome" OS, "Linux", "macOS", "Windows"
"Chrome" darbalaukio versija siūlo tris skirtingus šaltinio kodo peržiūros būdus, pirmuosius ir paprasčiausius, naudodami šią spartieji klavišai: CTRL + U ( COMMAND + OPTION + U , "macOS").
Paspaudus šią nuorodą atidaromas naujas naršyklės skirtukas, rodantis HTML ir kitą aktyvaus puslapio kodą. Šis šaltinis yra spalvotas ir struktūrizuotas taip, kad būtų paprasčiau suskaidyti ir rasti tai, ko ieškote. Taip pat galite ten patekti, įvesdami šį tekstą į "Chrome" adresų juostą, pridėtą prie interneto puslapio kairės pusės ir paspaudę klavišą Enter : rodinio šaltinis: (pvz., Peržiūros šaltinis: https: // www .)
Trečiasis metodas yra per "Chrome" kūrėjų įrankius , leidžiančius jums giliau pasinerti į puslapio kodą, taip pat patobulinti bandymą ir kūrimo tikslais. Kūrėjo įrankių sąsają galima atidaryti ir uždaryti naudodami šią spartieji klavišai: CTRL + SHIFT + I ( COMMAND + OPTION + I sistemoje macOS). Taip pat galite paleisti jas, atlikdami toliau nurodytą kelią.
- Spustelėkite "Chrome" pagrindinio meniu mygtuką, esantį viršutiniame dešiniajame kampe ir kurį sudaro trys vertikaliai suderinti taškai.
- Kai pasirodys išskleidžiamasis meniu, užveskite pelės žymeklį ant parinkties Daugiau įrankių .
- Pasirodžius submeniu, spustelėkite " Kūrėjo įrankiai" .
"Android"
Žiniatinklio puslapio šaltinis "Chrome", skirtu "Android", taip pat paprasta, kaip pridėti šį tekstą adreso priekyje (arba URL) ir pateikti jį: peržiūros šaltinis:. Pavyzdžiui, tai būtų rodinio šaltinis: https: // www. . HTML ir kitas atitinkamo puslapio kodas bus aktyviai rodomi akimirksniu.
"iOS"
Nors nėra originalių šaltinio kodo peržiūros metodų naudojant "Chrome" jūsų "iPad", "iPhone" ar "iPod touch", paprasčiausias ir efektyviausias būdas yra naudoti trečiosios šalies sprendimą, pvz., "Žiūrėti šaltinio" programą.
Programa "App Store" yra 0,99 dolerių. "View Source" raginama įvesti puslapio URL (arba nukopijuoti / įklijuoti jį iš "Chrome" adresų juostos, o tai kartais paprasčiausias kelias). Be HTML ir kito šaltinio kodo rodymo, programoje taip pat yra skirtukų, rodančių atskirą puslapio turtą, dokumento objektų modelį (DOM), puslapio dydį, slapukus ir kitą įdomią informaciją.
Microsoft Edge
Veikia: Windows
"Edge" naršyklė leidžia peržiūrėti, analizuoti ir net manipuliuoti dabartinio puslapio šaltiniu per " Developer Tools" sąsają. Norėdami pasinaudoti šia patogia įrankių rinkiniu, galite naudoti vieną iš šių sparčiųjų klavišų kombinacijų: F12 arba CTRL + U. Jei pageidaujate pasirinkti pelę, spustelėkite krašto meniu mygtuką (trys taškeliai, esantys viršutiniame dešiniajame kampe) ir pasirinkite iš sąrašo parinktį F12 Developer Tools .
Kai "dev" įrankiai yra pirmą kartą paleisti, "Edge" prideda dvi papildomas naršyklės kontekstinio meniu parinktis (pasiekiamas dešiniuoju pelės mygtuku spustelėję bet kur tinklalapio vietą): patikrinkite elementą ir peržiūrėkite šaltinį , pastarąjį, kuris atidaro Dev debugerio dalį įrankių sąsaja užpildyta šaltinio kodu.
Mozilla Firefox
Veikia: Linux, macOS, Windows
Jei norite peržiūrėti puslapio pradinį kodą "Firefox" darbalaukio versijoje, savo klaviatūroje galite paspausti CTRL + U ( COMMAND + U "macOS"), kuris atidarys naują skirtuką su HTML ir kitu aktyviojo tinklalapio kodu.
Jei įvesite šį tekstą į "Firefox" adresų juostą tiesiai kairėje puslapio URL, tas pats šaltinis bus rodomas dabartiniame skirtuke: rodinio šaltinis: (pvz., Peržiūros šaltinis: https: // www.) .
Kitas būdas pasiekti puslapio šaltinio kodą yra "Firefox" kūrėjų įrankiai, kuriuos galite pasiekti atlikdami šiuos veiksmus.
- Spustelėkite pagrindinio meniu mygtuką, esantį viršutiniame dešiniajame naršyklės lango kampe ir kurį sudaro trys horizontalios linijos.
- Pasirodžius pop-up meniu, spustelėkite piktogramą Kūrėjo raktas.
- Dabar žiniatinklio kūrėjų kontekstinio meniu turi būti matomi. Pasirinkite parinktį Puslapio šaltinis .
"Firefox" taip pat leidžia peržiūrėti šaltinio kodą konkrečiai puslapio daliai, todėl lengvai galima atskirti problemas. Norėdami tai padaryti, pirmiausia pažymėkite pele jus dominančią sritį. Tada dešiniuoju pelės mygtuku spustelėkite ir pasirinkite naršyklės kontekstinio meniu View Selection Source .
"Android"
"Firefox" "Android" versijoje esančio šaltinio kodo įvedimas yra įmanomas, priskiriant tinklalapio URL su šiuo tekstu: " view-source:" . Pavyzdžiui, norėdami peržiūrėti HTML šaltinį, naršyklės adreso juostoje turėtumėte pateikti šį tekstą: peržiūros šaltinis: https: // www. .
"iOS"
Mūsų rekomenduojamas būdas peržiūrėti puslapio pradinį kodą jūsų "iPad", "iPhone" ar "iPod touch" yra per "View Source" programą, kurią "App Store" galima įsigyti už 0,99 dolerius. Nors tiesiogiai nėra integruota tiesiogiai su "Firefox", galite lengvai nukopijuoti ir įklijuoti URL iš naršyklės į programą, kad būtų atskleistas HTML ir kitas su aptariamu puslapiu susietas kodas.
"Apple Safari"
Veikia "iOS" ir "macOS"
"iOS"
Nors "Safari" skirta "iOS" neįtraukia galimybės pagal numatytuosius nustatymus peržiūrėti šaltinio šaltinį, naršyklė gana vienodai integruojasi su "View Source" programa - pasiekiama "App Store" už 0,99 dolerius.
Įdiegę šią trečiosios šalies programą, grįžkite į "Safari" naršyklę ir bakstelėkite mygtuką "Bendrinti", esantį ekrano apačioje ir rodomą kvadratu ir rodyklę aukštyn. "IOS" pasidalijimo lapas dabar turėtų būti matomas, apatinėje "Safari" lango pusėje. Slinkite į dešinę ir pasirinkite mygtuką Žiūrėti šaltinį .
Dabar turėtų būti parodytas spalvinis, struktūrizuotas aktyviojo puslapio šaltinio kodas ir kiti skirtukai, leidžiantys peržiūrėti puslapio turinį, scenarijus ir dar daugiau.
macOS
Jei norite peržiūrėti "Safari" darbalaukio versijos puslapio šaltinio kodą, pirmiausia turite įjungti meniu " Develop" . Žemiau pateikiami veiksmai padės jums suaktyvinti šį paslėptą meniu ir rodyti puslapio HTML šaltinį.
- Spustelėkite " Safari " naršyklės meniu, esantį ekrano viršuje.
- Kai pasirodys išskleidžiamasis meniu, pasirinkite parinktį Parinktys .
- "Safari" nuostatos dabar turėtų būti matomos. Spustelėkite piktogramą Išplėstinė , esanti dešiniajame viršutinėje eilutėje.
- Antroje dalyje "Išplėstinė" apačioje yra parinktis, pažymėta meniu "Rodyti meniu" , kartu su tuščiu langeliu. Paspauskite ant šio langelio vieną kartą, kad jį pažymėtumėte, ir uždarykite "Preferences" langą spustelėdami raudoną "x", esantį viršutiniame kairiajame kampe.
- Spustelėkite " Develop" meniu, esantį ekrano viršuje.
- Kai pasirodys išskleidžiamasis meniu, pasirinkite Rodyti puslapio šaltinį . Vietoj to galite naudoti šią spartųjį klavišą: COMMAND + OPTION + U.
Opera
Veikia: Linux, macOS, Windows
Norėdami peržiūrėti iš naršyklės "Opera" esančio aktyviojo tinklalapio pradinį kodą, naudokite šią spartųjį klavišą: CTRL + U ( COMMAND + OPTION + U , "MacOS"). Jei pageidaujate įkelti šaltinį dabartiniame skirtuke, įveskite toliau esantį tekstą kairėje puslapio URL adreso juostoje ir paspauskite Enter : view-source: (pvz., Šaltinio rodinys: https: // www. )
"Opera" darbalaukio versija taip pat leidžia peržiūrėti HTML šaltinį, CSS ir kitus elementus, naudojant integruotus kūrėjo įrankius . Jei norite paleisti šią sąsają, kuri pagal numatytuosius nustatymus rodoma pagrindinio naršyklės lango dešinėje pusėje, paspauskite šią spartųjį klavišą: CTRL + SHIFT + I ( COMMAND + OPTION + I sistemoje macOS).
Operos kūrėjų įrankių rinkinys taip pat pasiekiamas atlikus šiuos veiksmus.
- Spustelėkite "Opera" logotipą, esantį viršutiniame kairiajame naršyklės lango kampe.
- Kai pasirodys išskleidžiamasis meniu, užveskite pelės žymeklį ant parinkties Daugiau įrankių .
- Spustelėkite Rodyti meniu kūrėją .
- Dar kartą spustelėkite "Opera" logotipą.
- Kai pasirodys išskleidžiamasis meniu, užveskite žymeklį ant " Developer" .
- Kai pasirodys submeniu, spustelėkite " Kūrėjo įrankiai" .
Vivaldi
Vivaldi naršyklės puslapio šaltinį galite peržiūrėti keliais būdais. Paprasčiausias yra per CTRL + U klaviatūros nuorodą, kuris pateikia kodą iš aktyviojo puslapio naujame skirtuke.
Taip pat galite pridėti šį tekstą puslapio priekio puslapio URL, kuris parodo šaltinio kodą šiame skirtuke: view-source:. Pavyzdžiui, tai būtų rodinio šaltinis: http: // www. .
Kitas metodas yra per naršyklės integruotus kūrėjo įrankius, pasiekiamas paspaudžiant kombinaciją CTRL + SHIFT + I arba per meniu " Įrankiai " naršyklės meniu " Įrankiai " esančią parinktį Kūrėjo įrankiai - spragtelėjus "V" logotipą viršutiniame kairiajame kampe. Naudojant dev įrankius galima nuodugniau išnagrinėti puslapio šaltinį.