Kā skatīt katras pārlūkprogrammas tīmekļa lapas avota kodu

Mājas lapa, kuru jūs lasāt, sastāv no cita starpā pirmkoda. Šī ir informācija, kuru jūsu tīmekļa pārlūkprogramma lejupielādē un pārveido par to, ko jūs lasāt tūlīt.

Lielākā daļa tīmekļa pārlūkprogrammu nodrošina iespēju redzēt tīmekļa lapas avota kodu bez nepieciešamas papildu programmatūras neatkarīgi no tā, kāda veida ierīce jūs izmantojat.

Daži no tiem pat piedāvā uzlabotu funkcionalitāti un struktūru, tādējādi atvieglojot HTML un citu programmēšanas kodu apskatīšanu lapā.

Kāpēc jūs vēlaties redzēt avota kodu?

Ir vairāki iemesli, kāpēc jūs varētu vēlēties redzēt lapas pirmkodu. Ja esat tīmekļa izstrādātājs, varbūt jūs vēlētos ieskatīties zem vāciņiem citā programmētāja īpašajā stilā vai īstenošanā. Varbūt jūs veicat kvalitātes nodrošināšanu un mēģina noskaidrot, kāpēc konkrēta daļa no tīmekļa lapas tiek padarīta vai rīkojas tā, kā tā ir.

Jūs varētu būt arī iesācējs, kurš mēģina iemācīties kodēt savas lapas un meklē dažus reālos piemērus. Protams, iespējams, ka jūs neietilpst nevienā no šīm kategorijām un vēlaties tikai apskatīt avotu, kas nav saistīta ar ziņkārību.

Zemāk uzskaitītie norādījumi par to, kā apskatīt pirmkodu izvēlētajā pārlūkprogrammā.

Google Chrome

Darbojas: Chrome OS, Linux, macOS, Windows

Chrome datora versija piedāvā trīs dažādas metodes lapas pirmkoda skatīšanai, pirmā un visvienkāršākā, izmantojot šādu īsinājumtaustiņu: CTRL + U ( COMMAND + OPTION + U uz macOS).

Nospiežot šo īsceļu, tiek atvērta jauna pārlūkprogrammas cilne, kurā tiek parādīts aktīvās lapas HTML un cits kods. Šis avots ir krāsu kodēts un strukturēts tā, ka tas ir vienkāršāk sadrumstalot un atrast to, ko jūs meklējat. Varat arī tur nokļūt, ievadot šādu tekstu pārlūka Chrome adreses joslā, kas pievienota tīmekļa lapas URL kreisajā pusē un nospiežot taustiņu Enter : skata avots: (ti, skata avots: https: // www .)

Trešā metode ir ar Chrome izstrādātāju rīkiem , kas ļauj jums padziļināti ienirt lapas kodu, kā arī pielāgot to tiešraidē testēšanas un izstrādes nolūkos. Izmantojot šo īsinājumtaustiņu, var atvērt un aizvērt izstrādātāju rīku saskarni: CTRL + SHIFT + I ( COMMAND + OPTION + I uz macOS). Jūs varat arī tos palaist, veicot šādu ceļu.

  1. Noklikšķiniet uz Chrome galvenās izvēlnes pogas, kas atrodas augšējā labajā stūrī un ko attēlo trīs vertikāli izlīdzināti punkti.
  2. Kad parādās nolaižamā izvēlne, novietojiet peles kursoru virs opcijas Vairāk rīki .
  3. Kad parādās apakšizvēlne, noklikšķiniet uz Izstrādātāju rīki .

Android
Web lapas avota pārlūkošana pārlūkā Android pārlūkam Chrome ir tikpat vienkārša kā pievienojot šādu tekstu adreses (vai URL) priekšā un tā iesniegšanai: skata avots:. Piemērs tam būtu skata avots: https: // www. . HTML un cits kods no attiecīgās lapas tiks tūlīt parādīts aktīvajā logā.

iOS
Lai gan jūsu iPad, iPhone vai iPod touch pārlūkprogrammā Chrome nav īstu kodu avota koda skatīšanai, vienkāršākais un visefektīvākais ir izmantot trešās puses risinājumu, piemēram, lietotni Skatīt avots.

Lietojumprogrammu veikalā pieejamais 0,99 ASV dolāru apmērā, skatīšanas avots piedāvā ievadīt lapas URL (vai arī kopēt / ielīmēt to no Chrome adreses joslas, kas dažreiz ir visvienkāršākais ceļš), un tas ir viss. Papildus HTML un cita pirmkoda rādīšanai lietotnē ir arī cilnes, kurās tiek parādīti atsevišķi lapas aktīvi, dokumentu objektu modelis (DOM), kā arī lapas izmērs, sīkfaili un citas interesantas detaļas.

Microsoft Edge

Darbojas: Windows

Edge pārlūks ļauj jums apskatīt, analizēt un pat manipulēt ar pašreizējās lapas avota kodu, izmantojot tā izstrādātāju rīku saskarni. Lai piekļūtu šim ērtajam rīku komplektam, varat izmantot vienu no šiem īsinājumtaustiņiem: F12 vai CTRL + U. Ja jūs gribētu, lai puse būtu tā vietā, noklikšķiniet uz Edge izvēlnes pogas (trīs punkti atrodas augšējā labajā stūrī) un izvēlieties iespēju F12 Developer Tools no saraksta.

Pēc tam, kad Dev rīki tiek palaisti pirmo reizi, Edge pievieno divas papildu opcijas pārlūkprogrammas konteksta izvēlnei (pieejama ar labo taustiņu noklikšķinot jebkurā vietnes Web vietā): Pārbaudiet elementu un Skatīt avotu - pēdējo, kas atver Dev devētājgerīces daļu instrumentu saskarne, kas apdzīvota ar pirmkodu.

Mozilla Firefox

Darbojas: Linux, macOS, Windows

Lai pārlūkprogrammas Firefox darbvirsmas versijā skatītu lapas avota kodu, varat tastatūrā nospiest taustiņu kombināciju CTRL + U ( COMMAND + U uz macOS), kas atvērs jaunu cilni, kurā atrodas aktīvās tīmekļa lapas HTML kods un cits kods.

Tiks ievadīt šādu tekstu Firefox adreses joslā tieši lapas lapas kreisajā pusē, tādēļ tas pats avots parādīsies pašreizējā cilnē: skatījuma avots: (ti, skata avots: https: // www.) .

Vēl viens veids, kā piekļūt lapas pirmkodam, ir Firefox izstrādātāju rīki, kas pieejami, veicot šādas darbības.

  1. Noklikšķiniet uz galvenās izvēlnes pogas, kas atrodas jūsu pārlūkprogrammas loga augšējā labajā stūrī un ko attēlo trīs horizontālas līnijas.
  2. Kad tiek parādīta izkrītošā izvēlne, noklikšķiniet uz ikonas Izstrādātāja uzgriežņu atslēga.
  3. Tīmekļa izstrādātāja konteksta izvēlne tagad ir redzama. Izvēlieties opciju Page Avota .

Firefox arī ļauj apskatīt avota kodu konkrētai lapas daļai, padarot to viegli izolēt. Lai to izdarītu, vispirms ar peli izvēlieties interesējošo apgabalu. Pēc tam ar peles labo pogu noklikšķiniet uz pogas un izvēlieties Skatīt izvēles avotu no pārlūka konteksta izvēlnes.

Android
Avota koda skatīšana Android versijā Firefox ir sasniedzama, prefiksējot tīmekļa lapas URL ar šādu tekstu: skata avots:. Piemēram, lai skatītu HTML avotu, jūs pārlūka adreses joslā iesniegtu šādu tekstu: skata avots: https: // www. .

iOS
Mūsu ieteiktā metode tīmekļa lapas avota koda skatīšanai jūsu iPad, iPhone vai iPod touch ir pieejama, izmantojot lietotni View Source, kas pieejama App Store par 0,99 ASV dolāriem. Kamēr nav tieši integrēta ar Firefox, jūs varat viegli nokopēt un ielīmēt URL no pārlūka lietotnē, lai atklātu HTML un citu kodu, kas saistīts ar attiecīgo lapu.

Apple Safari

Darbojas iOS un macOS

iOS
Lai gan pārlūkprogrammā Safari iOS nav iekļauta iespēja skatīt pēc noklusējuma lapu avota, pārlūks diezgan viegli integrējas ar lietotni Skatīt avots - tas pieejams App Store par 0,99 ASV dolāriem.

Pēc šī trešās puses lietotnes instalēšanas atveriet pārlūkprogrammu Safari un pieskarieties pogai Kopīgot, kas atrodas ekrāna apakšdaļā un kuru attēlo kvadrātveida un augšupvērstā bultiņa. Tagad ir jābūt redzamam iOS koplietošanas lapai, pārklājot Safari loga apakšējo pusi. Ritiniet pa labi un atlasiet pogu Skatīt avotu .

Tagad ir jāparāda aktīvās lapas avota koda krāsainu, strukturētu attēlojumu kopā ar citām cilnēm, kas ļauj skatīt lapas aktīvus, skriptus un citus.

macOS
Lai skatītu Safari datora versijas lapas pirmkodu, vispirms ir jāiespējo tā izstrādes izvēlne. Tālāk norādītie soļi ļauj jums aktivizēt šo slēpto izvēlni un parādīt lapas HTML avotu.

  1. Pārlūkprogrammas izvēlnē noklikšķiniet uz Safari , kas atrodas ekrāna augšdaļā.
  2. Kad parādās nolaižamā izvēlne, atlasiet opciju Preferences .
  3. Tagad Safari preferences tagad ir redzamas. Noklikšķiniet uz ikonas Papildu , kas atrodas augšējās rindas labajā pusē.
  4. Ceļā uz sadaļas Advanced (Papildu) apakšdaļu ir izvēles rūtiņa, kas tiek parādīta izvēlnē Display Show (Izstrādāt) , pievienojot tukšu rūtiņu. Noklikšķiniet uz šīs rūtiņas vienreiz, lai tajā ievietotu atzīmi, un aizveriet preferenču logu, noklikšķinot uz sarkanā "x", kas atrodas augšējā kreisajā stūrī.
  5. Noklikšķiniet uz izvēlnes Izstrādāt , kas atrodas ekrāna augšdaļā.
  6. Kad parādās nolaižamā izvēlne, atlasiet Rādīt lapas avotu . Tā vietā varat izmantot sekojošo tastatūras īsceļu: COMMAND + OPTION + U.

Opera

Darbojas: Linux, macOS, Windows

Lai apskatītu avota kodu no operatīvās pārlūkprogrammas aktīvās Web lapas, izmantojiet šo īsinājumtaustiņu: CTRL + U ( COMMAND + OPTION + U macOS). Ja vēlaties ievietot avotu esošajā cilnē, ievadiet tālāk redzamo tekstu no lapas URL no kreisās puses adreses joslā un nospiediet taustiņu Enter : skatījuma avots: (ti, skata avots: https: // www. )

Opera galddatora versija ļauj jums skatīt HTML avotu, CSS un citus elementus, izmantojot integrētos izstrādātāju rīkus . Lai palaistu šo saskarni, kas pēc noklusējuma parādīsies galvenā pārlūkprogrammas loga labajā pusē, nospiediet šo īsinājumtaustiņu: CTRL + SHIFT + I ( COMMAND + OPTION + I uz macOS).

Opera izstrādātāju rīku komplekts ir pieejams arī, veicot šādas darbības.

  1. Noklikšķiniet uz Opera logotipa, kas atrodas jūsu pārlūkprogrammas loga augšējā kreisajā stūrī.
  2. Kad parādās nolaižamā izvēlne, novietojiet peles kursoru virs opcijas Vairāk rīki .
  3. Noklikšķiniet uz Parādīt izstrādātāju izvēlni .
  4. Noklikšķiniet uz Opera logo vēlreiz.
  5. Ja parādās nolaižamā izvēlne, novietojiet kursoru virs izstrādātāja .
  6. Kad parādās apakšizvēlne, noklikšķiniet uz Izstrādātāju rīki .

Vivaldi

Vivaldi pārlūkprogrammā ir pieejami vairāki veidi, kā skatīt vietnes avotu. Visvienkāršākais ir CTRL + U tastatūras saīsne, kas jaunajā cilnē piedāvā aktīvās lapas kodu.

Jūs varat arī pievienot šādu tekstu lapas lapas priekšpusē, kas pašreizējā cilnē parāda pirmkodu: skata avots:. Piemēram, tas būtu skatījuma avots: http: // www. .

Cita metode ir caur pārlūkprogrammas integrētajiem izstrādātāju rīkiem, kas ir pieejami, nospiežot CTRL + SHIFT + I kombināciju vai izmantojot rīku Developer Tools opciju pārlūkprogrammas izvēlnē Tools - atrast, noklikšķinot uz logotipa "V" augšējā kreisajā stūrī. Dev rīku izmantošana ļauj padziļināti analizēt lapas avotu.