Kuidas vaadata veebilehe HTML-lähtekoodi

Kõik Interneti-brauserid võimaldavad kasutajatel vaadata iga külastatava veebilehe HTML-lähtekoodi. Järgmistes lõikudes on teavet mitmesuguste võimaluste kohta, kuidas iga peamise brauseri lähtekoodi vaadata. Jätkamiseks valige allolevast loendist kirje ja järgige selle sektsiooni juhiseid.

Veebilehe lähtekoodi vaatamisel on oluline meeles pidada, et teave ja kood, mida server ei töötle, ei ilmu. Näiteks töötavad peaaegu kõik Interneti otsingumootorid teavet serveris ja seejärel kuvavad tulemused veebilehel. Teisisõnu, saate vaadata tulemuste lehe moodustavat koodi, kuid otsingumootori lähtekoodi ei saa vaadata.

See reegel kehtib kõigi serveripoolsete skriptide, SSI ja programmeerimiskoodi kohta. Seetõttu ei kuvata selliseid funktsioone nagu otsingumootorid, foorumid, küsitlused, vestlus jne. Andmete kopeerimine lähtekoodi kaudu võib põhjustada vigu või suunata teid tagasi lehele, kust andmed kopeeriti.

Microsoft Edge'i kasutajad

Microsoft Edge veebilehe lähtekoodi vaatamiseks järgige alltoodud samme.

  1. Vajutage arvuti klaviatuuril Ctrl + U või F12 .
  2. Valige parempoolse akna ülaosas vahekaart Elements .

Or

Or

  1. Avage Microsoft Edge ja navigeerige oma valitud veebilehele.
  2. Klõpsake nuppu Veel

    ikooni ekraani paremas ülanurgas.
  3. Valige ilmuvast rippmenüüst Arendusvahendid .
  4. Valige parempoolse akna ülaosas vahekaart Elements .

Näpunäide: Microsoft Edge'is pakub DOM tööriist ka koos lähtekoodiga ja CSS seadetega, mis võimaldab kasutajatel näha, kuidas koodi muudatused veebilehte viivitamatult mõjutavad.

Microsoft Internet Exploreri kasutajad

Veebilehtede lähtekoodi vaatamiseks Microsoft Internet Exploreris järgige alltoodud samme.

  1. Vajutage arvuti klaviatuuril Ctrl + U või F12 .
  2. Klõpsake uue menüü ülaosas vahekaardil Debugger .

Or

Or

  1. Avage Internet Explorer ja liikuge oma valitud veebilehele.
  2. Brauseri menüüriba avamiseks vajutage klahvi Alt .
  3. Valige ilmuvast rippmenüüst Vaade ja seejärel Allikas .
  4. Klõpsake uue menüü ülaosas vahekaardil Debugger .

Näpunäide: Internet Exploreri viimaste versioonide puhul avab klahvi F12 vajutamine tööriista DOM. See tööriist pakub palju rohkem koostoimet lähtekoodi ja CSS-i seadetega, võimaldades kasutajatel näha, kuidas koodimuutused veebilehte viivitamatult mõjutavad.

Mozilla Firefoxi ja Netscape'i kasutajad

Mozilla Firefoxi veebilehe lähtekoodi vaatamiseks järgige alltoodud samme.

  1. Vajutage arvuti klaviatuuril Ctrl + U.

Or

Or

  1. Avage Mozilla Firefox ja navigeerige oma valitud veebilehele.
  2. Brauseri menüüriba avamiseks vajutage klahvi Alt .
  3. Valige Tools, Web Developer ja seejärel Page Source .

Näpunäide: Firefoxi viimaste versioonide puhul avab klahvi F12 või Ctrl + Shift + I interaktiivse arendaja tööriista. See tööriist pakub palju rohkem koostoimet lähtekoodi ja CSS-i seadetega, võimaldades kasutajatel näha, kuidas koodimuutused veebilehte viivitamatult mõjutavad.

Vaadake lehe lähtekoodi osa

  1. Tõstke esile veebilehe osa, millele soovite lähtekoodi vaadata.
  2. Paremklõpsake seda esiletõstetud osa ja seejärel klõpsake käsku Vaata valikuallikat .

Näpunäide. Kasutage lisandmooduli Firebug, et mitte ainult vaadata lehe lähtekoodi, vaid muuta ja vaadata neid muudatusi brauseri kaudu.

Google Chrome'i kasutajad

Google Chrome'i veebilehe lähtekoodi vaatamiseks järgige alltoodud samme.

  1. Vajutage arvuti klaviatuuril Ctrl + U.

Or

Or

  1. Avage Chrome ja navigeerige oma valitud veebilehel.
  2. Klõpsake nuppu Kohanda ja kontrolli Google Chrome'i

    ikoon brauseri akna paremas servas.
  3. Kuvatavast rippmenüüst valige Veel tööriistu ja seejärel Arendaja tööriistad .
  4. Klõpsake uue elemendi ülaosas olevale vahekaardile Elements .

Näpunäide: Chrome'i viimaste versioonide puhul avab klahvi F12 või Ctrl + Shift + I ka interaktiivse arendaja tööriista. See tööriist pakub palju rohkem koostoimet lähtekoodi ja CSS-i seadetega, võimaldades kasutajatel näha, kuidas koodimuutused veebilehte viivitamatult mõjutavad.

Apple Safari kasutajad

Apple Safari veebilehe lähtekoodi vaatamiseks järgige alltoodud samme.

  1. Vajutage klaviatuuril nuppu Command + Option + U.

Or

Or

  1. Avage Safari brauser ja navigeerige oma valitud veebilehele.
  2. Valige menüü Arenda .
  3. Valige suvand Kuva lehe allikas .

Opera kasutajad

Veebilehe lähtekoodi vaatamiseks operatsioonis Opera järgige alltoodud samme.

  1. Vajutage klaviatuuril Ctrl + U.

Or

Or

  1. Avage Opera ja navigeerige oma valitud veebilehele.
  2. Klõpsake nuppu Menüü

    brauseri akna vasakus ülanurgas.
  3. Valige alammenüü Arendaja lehel Allikas .

Näpunäide. Kui te ei näe arendaja alammenüüd, valige Veel tööriistad → Kuva arendaja menüü . Seejärel klõpsake menüü nuppu

uuesti. Nüüd peaksite kuvama arendaja alammenüü.

Näpunäide: Opera viimaste versioonide puhul avab otsetee kombinatsiooni Ctrl + Shift + I interaktiivse arendaja tööriista. See tööriist pakub palju rohkem koostoimet lähtekoodi ja CSS-i seadetega, võimaldades kasutajatel näha, kuidas koodimuutused veebilehte viivitamatult mõjutavad.

Android-telefon, mis töötab Chrome'is

  1. Avage oma telefoni Google Chrome'i veebibrauser.
  2. Avage veebileht, mille lähtekoodi soovite vaadata.
  3. Koputage üks kord aadressiribal ja seejärel liigutage kursor URL-i esiküljele.
  4. Sisestage view-source: ja vajutage Enter või Go .

Näpunäide. Näiteks meie kodulehe koodi vaatamiseks trükkige vaateallikas: //www.computerhope.com

Kuidas sulgeda lähtekoodi lehekülge või tööriista

Kui olete veebisaidil lähtekoodi vaatanud, võite selle sulgeda või sulgeda. Lähtekoodi sulgemine sõltub meetodist, mida olete selle avamiseks kasutanud.

  • Kui olete kasutanud Ctrl + U meetodit (va Edge) või paremklõpsamismeetodit, sulgege uus vahekaart, mis avati brauseri akna ülaosas.
  • Kui olete kasutanud arendaja meetodit (vajutades F12 või Ctrl + Shift + I), klõpsake nuppu

    tööriistade akna paremas ülanurgas.