Ինչպես դիտել Վեբ էջի Աղբյուրի կոդը յուրաքանչյուր զննարկիչում

Ընթերցանած ինտերնետային էջը կազմված է, ի թիվս այլ բաների, կոդով: Դա ձեր վեբ դիտարկիչը ներբեռնումն է եւ թարգմանում է այն, ինչ հիմա կարդում եք:

Վեբ զննարկիչներից շատերը ապահովում են վեբ էջի աղբյուրի կոդը տեսնելու հնարավորությունը, առանց որեւէ լրացուցիչ ծրագրային ապահովման, անկախ այն բանից, թե որ սարքի վրա եք գտնվում:

Ոմանք նույնիսկ առաջարկում են առաջադեմ գործառույթ եւ կառուցվածք, դարձնելով ավելի հեշտ է դիտել HTML- ի եւ այլ ծրագրավորման կոդը էջում:

Ինչու եք ուզում տեսնել Աղբյուրը կոդը:

Կան մի քանի պատճառ, թե ինչու դուք կարող եք տեսնել էջի կոդը: Եթե ​​դուք վեբ ծրագրավորող եք, թերեւս կցանկանայիք դիտել մեկ այլ ծրագրավորողի յուրահատուկ ոճով կամ իրականացմանը: Գուցե դուք որակի ապահովման մեջ եք եւ փորձում են պարզել, թե ինչու է վեբ-էջի որոշակի հատվածը մատուցել կամ վարվել:

Դուք նույնպես կարող եք սկսնակ լինել, փորձելով սովորել, թե ինչպես պետք է ձեր սեփական էջերը կոդավորեն եւ փնտրում են որոշակի իրական օրինակներ: Իհարկե, հնարավոր է, որ դուք չեք ընկնում այս կատեգորիաներից որեւէ մեկի մեջ եւ ուղղակի ցանկանում եք աղբյուրը դիտել բացառիկ հետաքրքրասիրությունից:

Ստորեւ թվարկված են հրահանգներ, թե ինչպես դիտելու ընտրացանկի կոդով ընտրված կոդը:

Google Chrome

Վազում `Chrome OS, Linux, MacOS, Windows

Chrome- ի աշխատասեղան տարբերակը առաջարկում է երեք տարբեր մեթոդներ, դիտելու էջի սկզբնական կոդը, առաջին եւ ամենապարզը, օգտագործելով հետեւյալ ստեղնաշարի դյուրանցումը: CTRL + U ( COMMAND + OPTION + U- ը macOS- ում):

Երբ սեղմված այս կարճուղիը բացում է նոր բրաուզերի էջ, ակտիվ էջի HTML եւ այլ կոդեր: Այս աղբյուրը գունավոր-կոդավորված եւ կառուցված է այն ձեւով, որը հեշտացնում է compartmentalize եւ գտնել այն, ինչ փնտրում եք: Կարող եք նաեւ այնտեղ մուտք գործել `Chrome- ի հասցեների բարում մուտքագրված հետեւյալ տեքստը, որը կցվում է վեբ էջի URL- ի ձախ կողմում եւ հարվածում է Enter ստեղն: դիտել աղբյուրը (այսինքն, դիտման աղբյուրը` https: // www ):

Երրորդ մեթոդը Chrome- ի մշակող գործիքների միջոցով է , որը թույլ է տալիս ավելի խորը սուզվել էջի կոդի մեջ, ինչպես նաեւ թրթռել եւ մշակման նպատակով թռիչք կատարել: Ծրագրիչի գործիքների ինտերֆեյսը կարող է բացվել եւ փակվել, օգտագործելով այս ստեղնաշարի դյուրանցումները ` CTRL + SHIFT + I ( COMMAND + OPTION + I մակ Mac): Դուք կարող եք նաեւ դրանք սկսել, օգտագործելով հետեւյալ ճանապարհը:

1. Սեղմեք Chrome- ի հիմնական ցանկի կոճակը, որը գտնվում է վերեւի աջ անկյունում եւ ներկայացված է երեք ուղղահայաց գծերով:
2. Երբ բացվող մենյուը հայտնվում է, սավառնել մկնիկի կուրսորը ավելի գործիքների տարբերակով:
3. Երբ ենթաֆունկցիան հայտնվում է, հպեք Developer գործիքներին :

Android- ը
Chrome- ի համար Chrome- ի վեբ էջի աղբյուրը դիտելը հեշտ է, քանի որ այն իր հասցեի (կամ URL- ի) ճակատին կցելու եւ տեքստը ներկայացնելու համար հետեւյալ կերպ . Դրա օրինակ կարող է դիտել աղբյուրը. Https: // www. . HTML- ի եւ այլ կայքի կոդը, որը կախված է էջից, ակնթարթորեն կհայտնվի ակտիվ պատուհանում:

iOS- ը
Չնայած ձեր iPad- ի, iPhone- ի կամ iPod touch- ի օգնությամբ աղբյուրի կոդը դիտելու հայրենի մեթոդներ չկան, ամենապարզ եւ ամենաարդյունավետն այն է, օգտվել երրորդ կողմի լուծումից, ինչպիսիք են View Source ծրագիրը:

App Store- ում $ 0.99-ով մատչելի, Տես Աղբյուրը հուշում է Ձեզ մուտք գործել էջի URL- ն (կամ պատճենեք այն Chrome- ի հասցեի բարից, որը երբեմն ամենաարդյունավետ ճանապարհն է) եւ դա դա է: Բացի HTML- ի եւ այլ աղբյուրների կոդը, հավելվածն ունի նաեւ էջանիշեր, որոնք ցուցադրում են անհատական ​​էջերի ակտիվներ, փաստաթղթի օբյեկտի մոդելը (DOM), ինչպես նաեւ էջի չափը, բլիթները եւ այլ հետաքրքիր մանրամասները:

Microsoft Edge

Վազում `Windows

The Edge բրաուզերը թույլ է տալիս դիտել, վերլուծել եւ նույնիսկ փոխել ընթացիկ էջի կոդը, իր Developer Tools ինտերֆեյսի միջոցով: Այս հարմար գործիքակն օգտագործելու համար դուք կարող եք օգտագործել այս ստեղնաշարի դյուրանցումներից մեկը. F12 կամ CTRL + U : Փոխարենը, նախընտրում եք մկնիկը, սեղմեք Edge- ի մենյուի կոճակը (վերեւի աջ անկյունում գտնվող երեք կետ) եւ ընտրեք F12 Developer Tools տարբերակը ցանկից:

Դրվագային գործիքների առաջին անգամ գործարկումից հետո Edge հավելվածը ավելացնում է երկու լրացուցիչ տարբերակներ `զննարկչի համատեքստում, որը կարող է տեղադրվել ցանկացած էջի մեջ, սեղմելով հղումը, վեբ էջում տեղադրեք ցանկացած վայրում: Տեսեք տարրը եւ դիտեք աղբյուրը , որը բացում է կրկնօրինակը : գործիքների ինտերֆեյս, որը բնակեցված է կոդով:

Mozilla Firefox

Վազում `Linux, macOS, Windows

Էջի կոդը դիտելու համար Firefox- ի աշխատասեղանի տարբերակով դուք կարող եք սեղմել CTRL + U ( COMMAND + U- ը macOS- ում) ձեր ստեղնաշարի վրա, որը կբացի նոր էջ, որը պարունակում է HTML- ի եւ այլ կոդի պարունակությունը ակտիվ վեբ-էջի համար:

Հետեւյալ տեքստը մուտքագրելով Firefox- ի հասցեի տողում, անմիջապես էջի URL- ի ձախ կողմում, նույն աղբյուրը կհանգեցնի ներկայիս ներդիրի փոխարեն, դիտելու աղբյուրը (այսինքն, դիտման աղբյուրը `https: // www): .

Մեկ էջի աղբյուրի կոդը մուտք գործելու մեկ այլ միջոց է Firefox- ի մշակող գործիքների միջոցով, հասանելի դարձնելով հետեւյալ քայլերը:

1. Սեղմեք հիմնական ցանկի կոճակը, որը գտնվում է ձեր դիտարկիչի պատուհանի վերեւի աջ անկյունում եւ ներկայացված է երեք հորիզոնական գծերով:
2. Երբ հայտնվում է pop-out ընտրացանկը, սեղմեք « Հեղինակ » «փորձնական» պատկերակը:
3. Web Developer- ի համատեքստում մենյուը պետք է այժմ տեսանելի լինի: Ընտրեք էջի աղբյուրի ընտրանքը:

Firefox- ը նաեւ թույլ է տալիս Ձեզ դիտել աղբյուրի կոդը, էջի որոշակի հատվածի համար, ինչը հեշտացնում է խնդիրները մեկուսացնելու համար: Դա անելու համար առաջին հերթին կարեւորեց այն մակերեսը, որը դուք հետաքրքրված եք ձեր մկնիկով: Հաջորդը, սեղմեք աջը եւ ընտրեք դիտել ընտրման աղբյուրը բրաուզերի համատեքստում:

Android- ը
Firefox- ի Android- ի տարբերակով դիտման աղբյուրը հասանելի է վեբ էջի URL- ի նախնական տարբերակով, հետեւյալ տեսքով. Դիտել աղբյուրը . Օրինակ, HTML- ի աղբյուրը դիտելու համար դուք կցուցադրեք հետեւյալ տեքստը զննարկիչի հասցեի սանդղակում ` դիտել աղբյուրը` https: // www. .

iOS- ը
Ձեր առաջարկած մեթոդը ձեր iPad- ի, iPhone- ի կամ iPod touch- ում վեբ էջի կոդի կոդը դիտելու համար App Store- ում առկա է $ 0.99-ի համար նախատեսված View Source հավելվածի միջոցով: Չնայած ուղղակիորեն ինտեգրված Firefox- ի հետ, դուք կարող եք հեշտությամբ պատճենել եւ տեղադրեք URL- ը զննարկիչից ծրագիր, որպեսզի բացահայտի HTML- ի եւ տվյալ էջի հետ կապված այլ կոդերը:

Apple Safari- ն

Աշխատում է iOS- ի եւ MacOS- ի վրա

iOS- ը
Թեեւ Safari- ն iOS- ի համար չի ընդգրկում էջի աղբյուրը լռելյայնորեն դիտելու հնարավորություն, զննարկիչը միանգամայն աննկատորեն ինտեգրվում է View Source հավելվածին, որը App Store- ում առկա է $ 0.99-ով:

Այս երրորդ կողմի հավելվածը տեղադրելուց հետո վերադարձեք Safari բրաուզերը եւ սեղմեք Share կոճակը, որը գտնվում է էկրանի ներքեւում եւ ներկայացված է հրապարակում եւ բարձր սլաքով: The iOS Share Sheet- ը այժմ պետք է տեսանելի լինի, ձեր Safari պատուհանի ստորին կափարիչի վրա: Ոլորեք դեպի աջը եւ ընտրեք Աղբյուրը կոճակը:

Այժմ պետք է ցուցադրվի ակտիվ էջի կոդի գունավոր-կոդավորված, կազմաձեւված ներկայացում, ինչպես նաեւ այլ ներդիրներ, որոնք թույլ են տալիս դիտել էջի ակտիվները, սցենարներ եւ այլն:

macOS
Safari- ի աշխատասեղանի տարբերակով էջի սկզբնական կոդը դիտելու համար դուք նախ պետք է հնարավորություն ընձեռեք զարգացնել ցանկը: Ստորեւ քայլերը քայլում եք այս թաքնված մենյուի ակտիվացման եւ էջի HTML աղբյուրի ցուցադրման միջոցով:

1. Սեղմիր Safari- ին, զննարկիչի ցանկում, որը գտնվում է էկրանի վերեւում:
2. Երբ կաթվածի ընտրացանկը հայտնվի, ընտրեք Նախապատվություններ տարբերակը:
3. Այժմ Safari- ի նախասիրությունները պետք է տեսանելի լինեն: Հպեք Ընդլայնված պատկերակը, որը գտնվում է վերին շարքի հեռու աջ կողմում:
4. Ընդլայնված բաժնի ներքեւի մասում ընտրացանկի բարում նշվում է Ցույց տալ Մշակել ցանկը , որը ուղեկցվում է դատարկ վանդակում: Սեղմեք այս վանդակում մեկ անգամ ստուգման նշան դրեք, եւ փակեք Preferences պատուհանը, սեղմելով վերին ձախ անկյունում հայտնաբերված կարմիր 'x':
5. Սեղմիր զարգացող ցանկը, որը գտնվում է էկրանի վերեւում:
6. Երբ բացվող մենյունը հայտնվի, ընտրեք էջի աղբյուրը : Դուք նաեւ կարող եք օգտագործել հետեւյալ ստեղնաշարի կարճուղի փոխարեն ` COMMAND + OPTION + U :

Օպերա

Վազում `Linux, macOS, Windows

Օպերայի բրաուզերում գործող էջից աղբյուրի կոդը դիտելու համար օգտագործեք հետեւյալ ստեղնաշարի դյուրանցումները ` CTRL + U ( COMMAND + OPTION + U- ի macOS- ում): Եթե ​​նախընտրում եք ներկայացնել ներածված ներդիրի ներսում աղբյուրը, մուտքագրեք հետեւյալ տեքստը էջի URL- ի ձախ կողմում գտնվող հասցեի գոտում եւ մուտքագրեք Enter : view-source: (այսինքն, դիտման աղբյուրը `https: // www. ):

Օպերայի աշխատասեղան տարբերակը թույլ է տալիս դիտել HTML աղբյուր, CSS եւ այլ տարրեր, օգտագործելով իր ինտեգրված մշակող գործիքները : Այս ինտերֆեյսը գործարկելու համար, որը լռակյաց կերպով կհայտնվի ձեր հիմնական զննարկիչի պատուհանի աջ կողմում, սեղմեք հետեւյալ ստեղնաշարի կարճուղին. CTRL + SHIFT + I ( COMMAND + OPTION + I մակոշի վրա):

Օպերայի մշակող գործիքակազմը հասանելի է նաեւ հետեւյալ քայլերով:

1. Սեղմեք բրաուզերի պատուհանի վերին ձախ անկյունում գտնվող Օպերայի լոգոն:
2. Երբ կաթվածի ընտրացանկը հայտնվում է, սեղմեք ձեր մկնիկի կուրսորը ավելի գործիքների տարբերակով:
3. Սեղմիր Ցուցադրել մշակողի ցանկը :
4. Սեղմեք Օպերայի լոգոն կրկին:
5. Երբ կաթվածի ցանկը հայտնվում է, սավառնել ձեր կուրսորը դեպի Developer :
6. Երբ ենթախմբի մենյունը հայտնվի, սեղմեք Հեղինակ գործիքների վրա :

Վիվալդի

Vivaldi- ի դիտարկիչի էջի աղբյուրը դիտելու մի քանի տարբերակներ կան: Ամենապարզը CTRL + U ստեղնաշարի դյուրանցման միջոցով է, որը նոր էջում ներկայացնում է կոդը ակտիվ էջից:

Դուք կարող եք նաեւ ավելացնել հետեւյալ տեքստը էջի URL- ի առջեւում, որը ցույց է տալիս ներկա ներդիրի ներածական կոդը ` դիտել-աղբյուրը . Դրա օրինակ կարող է դիտել աղբյուրը. Http: // www. .

Մեկ այլ եղանակ է զննարկչի ինտեգրված մշակող գործիքների միջոցով, հասանելի դարձնելով CTRL + SHIFT + I համադրությունը կամ բրաուզերի Գործիքների ընտրացանկի միջոցով « Ստեղծագործող գործիքներ» տարբերակը, որը գտնվում է վերեւի ձախ անկյունում «V» տառով սեղմելով: Օգտագործելով գործիքի գործիքները թույլ են տալիս ավելի խորը վերլուծել էջի աղբյուրը: