Hər bir brauzerdə Veb səhifə mənbəyi kodunu necə görmək olar

Oxuduğunuz veb səhifə, başqaları ilə yanaşı, mənbə kodundan ibarətdir. İndi veb-brauzerinizin yüklədiyiniz və oxuduğunuz halına çevrilən məlumatdır.

Çox veb brauzerlər, hansı cihaz növü olmağınızdan asılı olmayaraq, heç bir əlavə proqram təminatı olmadan veb səhifənin mənbə kodunu görmək imkanı verir.

Bəziləri, hətta HTML və digər proqramlaşdırma kodunu səhifə üzərində işləməyə asanlaşdıran inkişaf etmiş funksionallıq və quruluş təklif edir.

Niyə Mənbə Məcəlləsinə baxmaq istəyirsiniz?

Bir sayfanın kaynak kodunu görmek isteyebileceğiniz bir neçə səbəb var. Bir web geliştiriciyseniz, bəlkə də başqa bir proqramçıya xüsusi stil və ya tətbiqdə örtüklər altında bir göz atın. Bəlkə keyfiyyəti təmin edirsiniz və bir web səhifənin müəyyən bir hissəsi niyə bu şəkildə işlədiyini və ya davranışını təsbit etməyə çalışırsınız.

Öz səhifələrini kodlaşdırmaq və bəzi real dünya nümunələrini axtarmağı öyrənmək üçün bir başlanğıc ola bilərsiniz. Əlbəttə ki, bu kateqoriyadan heç birinə düşməmisiniz və yalnız mənbəyi maraqdan kənarlaşdırmaq istəyirik.

Aşağıda, seçdiyiniz brauzerinizdəki mənbə kodunun necə göstərilməsinə dair təlimat verilmişdir.

Google Chrome

Çalışır: Chrome OS, Linux, macOS, Windows

Chrome'un masa üstü versiyası aşağıdakı bir klaviatura qısa yolunu istifadə edərək ilk və ən sadə bir səhifənin mənbə kodunu görüntüləmək üçün üç müxtəlif metod təklif edir: CTRL + U (MacOS + COMMAND + OPTION + U ).

Bu düyməyə basıldığında, aktiv səhifə üçün HTML və digər kodları göstərən yeni bir tarayıcı sekmesi açılır. Bu qaynaq rəngli və strukturlaşdırılmış şəkildə bölüşdürmə və aradığınız şeyi tapmaq üçün asanlaşdırır. Həmçinin, Chrome-un ünvan barında aşağıdakı mətni daxil etməklə əldə edə bilərsiniz, veb səhifənin URL -in sol tərəfinə əlavə olunur və " Enter" düyməsinə vurun: baxış mənbəyi: (yəni, görünüşlü mənbə: https: // www .).

Üçüncü üsul Chrome-un geliştirici vasitələrindən ibarətdir və bu, səhifə koduna daha dərin bir dalğalanmaq və test və inkişaf məqsədləri üçün on-the-fly-da çimdik imkan verir. Geliştirici vasitələrinin interfeysi bu klaviatura qısa yolunu istifadə edərək aça və bağlana bilər: CTRL + SHIFT + I (MacOS + COMMAND + OPTION + I ). Bundan əlavə, aşağıdakı yolları götürərək onları başlata bilərsiniz.

  1. Sağ üst küncdə yerləşən və üç vertikal hizalı nöqtə ilə göstərilən Chrome əsas menyu düyməsini basın.
  2. Açılır menyuda göründüyündə, Siçan imlecini Daha çox alətlər seçimi üzərinə sürüşdürün.
  3. Alt menyu göründükdə, Developer vasitələrini basın.

Android
Android üçün Chrome-dakı veb səhifənin mənbəyini göstərmək onun ünvanının (və ya URL) önünə aşağıdakı mətni əlavə etmək və göndərmək kimi sadədir: görünüş-mənbə:. Bunun bir nümunəsi mənbə-mənbə olacaq: https: // www. . Sözügedən səhifədən HTML və digər kod aktiv pəncərədə dərhal göstərilir.

iOS
IPad, iPhone və ya iPod touch-dakı Chrome-dan istifadə edərək, mənbə kodunu görüntüləmək üçün heç bir doğma metod yoxdur, ən sadə və ən effektiv baxma Source app kimi bir üçüncü tərəfi həll etməkdir.

App Store-da $ 0.99-a qədər mövcuddur, Mənbəyi Görüntüləyin səhifənin URL-nini (ya da onu bəzən ən sadə yol olan Chrome-un ünvan barından kopyalayıb yapışdırıb) və sizdən istəyə bilərsiniz. HTML və digər mənbə kodlarını göstərməklə yanaşı, app həmçinin fərdi səhifə aktivlərini, Document Object Model (DOM), həmçinin səhifə ölçüsü, cookie və digər maraqlı detallar göstərən sekmələrə malikdir.

Microsoft Edge

Çalışır: Windows

Edge brauzeri bu cari səhifənin mənbə kodunu, onun Developer Tools interfeysi vasitəsilə nəzərdən keçirmək, təhlil etmək və hətta manipulyasiya etməyə imkan verir. Bu lazımlı alətə daxil olmaq üçün bu klaviatura qısayollarından birini istifadə edə bilərsiniz: F12 və ya CTRL + U. Bunun yerinə siçanı tercih ederseniz, Edge'in menyusu düyməsini (sağ üst köşedeki üç nöqtə) basın və siyahıdan F12 Developer Tools seçin.

Dev alətləri ilk dəfə işlədildikdən sonra, Edge brauzerin kontekst menyusuna iki əlavə variant əlavə edər (bir web page daxilində hər hansı bir yeri sağ tıklayaraq əldə edə bilərsiniz): Elementi yoxlayınbaxın qaynağını , mənbə kodu ilə doldurulmuş vasitə interfeys.

Mozilla Firefox

Running: Linux, macOS, Windows

Bir səhifənin qaynaq kodunu Firefox'un masa üstü versiyasına keçirmək üçün klavyenizdeki CTRL + U ( COMMAND + U düyməsini) düyməsini basaraq, effektiv web səhifəsi üçün HTML və digər kodları olan yeni bir sekməni aça bilərsiniz.

Aşağıdakı mətni Firefox-un ünvan çubuğuna birbaşa səhifə URL'sinin sol tərəfinə yazaraq, eyni qaynağın yerinə bu cədvəldə göstərilməsinə səbəb olacaq: görünüşlü mənbə: (yəni, görünüşlü mənbə: https: // www). .

Bir səhifənin qaynaq koduna daxil olmaq üçün başqa bir üsul Firefox'un geliştirici vasitələrindən ibarətdir, aşağıdakı adımları atmaqla əldə edilə bilər.

  1. Brauzerinizin pəncərəsinin yuxarı sağ küncündə yerləşən və üç üfüqi xəttlə təmsil olunan əsas menyu düyməsini basın.
  2. Pop-menü göründükdə, Developer "açarı" simgesini basın.
  3. Web Developer kontekstində menyusu indi görünən olmalıdır. Səhifə Kaynağı seçimini seçin.

Firefox ayrıca, səhifənin müəyyən bir hissəsi üçün mənbə kodunu görüntüləməyə imkan verir ki, bu da məsələləri asanlaşdırmaqdır. Bunu etmək üçün əvvəlcə maraqlandıran ərazini farenizle vurğulamaq. Daha sonra, brauzerinizin kontekst menyusundan sağa vurun və seçmə mənbəyini göstərin.

Android
Firefox'un Android versiyasındakı mənbə kodu veb-səhifənin URL-i aşağıdakı mətn ilə öncə əldə etməklə əldə edilə bilər: görünüş-mənbə:. Məsələn, brauzerin ünvan çubuğunda aşağıdakı mətni təqdim etməyiniz üçün HTML mənbəyini keçirmək üçün: görünüşlü mənbə: https: // www. .

iOS
IPad, iPhone və ya iPod touch-a veb səhifənin qaynaq kodunu nəzərdən keçirmək üçün tövsiyə edilən metod App Store-da $ 0.99 üçün olan View Source tətbiqindən keçir. Birbaşa Firefox ilə inteqrasiya olunmayaraq, sözügedən səhifənin HTML və digər kodunu açmaq üçün brauzerdən URL-yə asanlıqla kopyalayıb yapışdıra bilərsiniz.

Apple Safari

IOS və macOS-da işləyirik

iOS
IOS üçün Safari ixtiyarına baxmayaraq, səhifənin mənbəyini default olaraq göstərmək imkanı yoxdur, baxmayaraq ki, brauzer App Store-da $ 0.99 üçün mövcud olan View Source app ilə birbaşa əlaqəsizləşdirir.

Bu üçüncü tərəf tətbiqini quraşdırdıqdan sonra Safari brauzerinə qayıdın və ekranın altındakı bir kvadrat və yuxarı ox ilə təmsil olunan Paylaş düyməsini vurun. İndi iOS Share Sheet, Safari pencerenizin alt yarısını örtmək üçün görünən olmalıdır. Sağa fırladın və View Source düyməsini seçin.

Aktiv səhifənin qaynaq kodunun rəng kodlu, strukturlaşdırılmış təqdimatı artıq səhifə aktivlərini, skriptləri və daha çox görüntüləmək üçün imkan verən digər sekmelerlə birlikdə nümayiş etdirilməlidir.

macOS
Safari'nin masa üstü versiyasında bir səhifənin mənbə kodunu görüntüləmək üçün, əvvəlcədən Dəyişdirmək menyusunu aktivləşdirməlisiniz. Aşağıdakı addımlar bu gizli menyunu aktivləşdirmək və bir səhifənin HTML mənbəyini göstərməklə sizi əhatə edir.

  1. Ekranın yuxarısında yerləşən brauzer menyusundan Safari -ə vurun.
  2. Açılır menyudan göründükdə, Tercihlər seçimini seçin.
  3. Safari'nin Tercihleri ​​indi görünən olmalıdır. Üst sətrin sağ tərəfində yerləşən Ətraflı icon vurun.
  4. İrəli bölmənin altına doğru, menyu çubuğunda " Show Develop" menyusunu etiketli bir seçimdir və boş bir onay qutusu ilə müşayiət olunur. Bunun üzərinə bir onay işareti qoymaq üçün bir dəfə bu qutuyu basın və sol üst köşedeki qırmızı 'x' düyməsinə basaraq Preferences penceresini bağlayın.
  5. Ekranın yuxarısında yerləşən Dəyişdirmək menyusuna basın.
  6. Açılır menyudan göründükdə, Səhifə Baxını Göstər seçin. Əvəzinə aşağıdakı klaviatura kısayolunu istifadə edə bilərsiniz: COMMAND + OPTION + U.

Opera

Running: Linux, macOS, Windows

Opera brauzerindəki aktiv veb-səhifədən mənbə kodunu keçirmək üçün aşağıdakı klaviatura qısayolunu istifadə edin: CTRL + U (MacOS-da COMMAND + OPTION + U ). Mövcud sekmədən qaynağın yüklənməsini xahiş edirsəniz, ünvan çubuğunun içindəki səhifənin URL'sinin solunda aşağıdakı mətni yazın və daxil olun : giriş mənbəyi: (yəni, görünüşlü mənbə: https: // www. ).

Opera-nın masa üstü versiyası da HTML-nin, CSS-nin və digər elementlərin inteqrasiya edilmiş geliştirici vasitələrindən istifadə etməsini təmin etməyə imkan verir. Önceden ana tarayıcınızın penceresinin sağ tarafında görünecek olan bu arabirimi başlatmak üçün aşağıdakı klaviatura kısayoluna basın: CTRL + SHIFT + I ( COMMOS + OPTION + I macOS).

Opera'nın geliştirici araç setine aşağıdakı adımları atarak da erişilebilir.

  1. Brauzerinizin yuxarı sol küncündə yerləşən Opera loqosunu basın.
  2. Açılır menyuda göründüyündə, Siçan imlecini Daha çox alətlər seçimi üzərinə sürüşdürün.
  3. Geliştirici menüsünü göster'i basın.
  4. Opera loqosunu yenidən basın.
  5. Açılır menyuda göründükdə, imlecinizi Geliştirici üzərinə sürükleyin.
  6. Alt menyu göründükdə, Developer Tools düyməsini basın.

Vivaldi

Vivaldi brauzeri daxilində səhifənin qaynını görüntüləmək üçün bir çox yolu var. Ən sadə CTRL + U klaviatura qısa yoludur, bu, yeni bir sekmədən aktiv səhifədən kod təqdim edir.

Aşağıdakı mətni, səhifənin URL'sinə əlavə edə bilərsiniz, bu, mövcud sekmeydə mənbə kodunu görüntüləyir: view-source:. Bunun bir nümunəsi mənbə mənbəyi olacaq: http: // www. .

Başqa bir üsul, CTRL + SHIFT + I birləşməsinə və ya brauzerin Tools menüsündeki Geliştirici Araçları seçeneğine basaraq, sol üst köşedeki 'V' loqosuna tıklayarak erişilebilirdir. Dev alətlərindən istifadə səhifənin qaynağının daha dərin təhlili üçün imkan verir.