تتيح جميع متصفحات الإنترنت للمستخدمين عرض شفرة مصدر HTML لأي صفحة ويب يزورونها. تحتوي الأقسام التالية على معلومات حول الطرق المتعددة لعرض التعليمات البرمجية المصدر في كل من المتصفحات الرئيسية. للمتابعة ، اختر إدخالًا من القائمة أدناه واتبع الإرشادات الخاصة بهذا القسم.

عند عرض التعليمات البرمجية المصدر لصفحة ويب ، من المهم أن تضع في اعتبارك أن المعلومات والرمز الذي لم تتم معالجته بواسطة الخادم لن يظهر. على سبيل المثال ، تقوم معظم محركات البحث على الإنترنت بمعالجة المعلومات على الخادم ، ثم عرض النتائج على صفحة ويب. بمعنى آخر ، يمكنك عرض الكود الذي يتكون من صفحة النتائج ، لكن لا يمكنك عرض الكود المصدري لمحرك البحث.

تنطبق هذه القاعدة على جميع البرامج النصية من جانب الخادم ، و SSI ، ورمز البرمجة. لذلك ، فإن الميزات ، مثل محركات البحث والمنتديات واستطلاعات الرأي والدردشة وما إلى ذلك ، لن تعرض أكوادها. قد يؤدي نسخ المعلومات من التعليمات البرمجية المصدر إلى حدوث أخطاء أو توجيهك إلى الصفحة التي قمت بنسخ المعلومات منها.

مستخدمي Microsoft Edge

لعرض التعليمات البرمجية المصدر لصفحة ويب في Microsoft Edge ، اتبع الخطوات أدناه.

1. اضغط على Ctrl + U أو F12 على لوحة مفاتيح الكمبيوتر.
2. حدد علامة تبويب العناصر في أعلى النافذة اليمنى.

أو

أو

1. افتح Microsoft Edge وانتقل إلى صفحة الويب التي تختارها.
2. انقر فوق المزيد
   
   أيقونة في الزاوية العلوية اليمنى من الشاشة.
3. حدد أدوات المطور من القائمة المنسدلة التي تظهر.
4. حدد علامة تبويب العناصر في أعلى النافذة اليمنى.

نصيحة: في Microsoft Edge ، توفر أداة DOM أيضًا تفاعلًا مع التعليمات البرمجية المصدر وإعدادات CSS ، مما يتيح للمستخدمين معرفة كيف تؤثر التغييرات في الشفرة على صفحة الويب فورًا.

مستخدمي مايكروسوفت إنترنت إكسبلورر

لعرض التعليمات البرمجية المصدر لصفحة ويب في Microsoft Internet Explorer ، اتبع الخطوات أدناه.

1. اضغط على Ctrl + U أو F12 على لوحة مفاتيح الكمبيوتر.
2. انقر فوق علامة التبويب Debugger في الجزء العلوي من القائمة الجديدة.

أو

أو

1. افتح Internet Explorer وانتقل إلى صفحة الويب التي تختارها.
2. اضغط على مفتاح Alt لإظهار شريط قوائم المتصفح.
3. حدد عرض ، ثم المصدر من القائمة المنسدلة التي تظهر.
4. انقر فوق علامة التبويب Debugger في الجزء العلوي من القائمة الجديدة.

نصيحة: باستخدام أحدث إصدارات Internet Explorer ، يؤدي الضغط على المفتاح F12 إلى إظهار أداة DOM. توفر هذه الأداة تفاعلًا أكبر بكثير مع الكود المصدري وإعدادات CSS ، مما يسمح للمستخدمين بمعرفة كيف تؤثر التغييرات في الكود على صفحة الويب فورًا.

مستخدمو Mozilla Firefox و Netscape

لعرض التعليمات البرمجية المصدر لصفحة ويب في Mozilla Firefox ، اتبع الخطوات أدناه.

1. اضغط على Ctrl + U على لوحة مفاتيح الكمبيوتر.

أو

أو

1. افتح Mozilla Firefox وانتقل إلى صفحة الويب التي تختارها.
2. اضغط على مفتاح Alt لإظهار شريط قوائم المتصفح.
3. حدد أدوات ، مطور ويب ، ثم مصدر الصفحة .

نصيحة: باستخدام أحدث إصدارات Firefox ، يؤدي الضغط على المفتاح F12 أو Ctrl + Shift + I إلى إظهار أداة المطور التفاعلية. توفر هذه الأداة تفاعلًا أكبر بكثير مع الكود المصدري وإعدادات CSS ، مما يسمح للمستخدمين بمعرفة كيف تؤثر التغييرات في الكود على صفحة الويب فورًا.

عرض قسم من الكود المصدري للصفحة

1. قم بتمييز جزء صفحة الويب الذي تريد عرض الكود المصدري له.
2. انقر بزر الماوس الأيمن فوق هذا القسم المميز ، ثم انقر فوق عرض مصدر التحديد .

نصيحة: استخدم الوظيفة الإضافية Firebug ليس فقط لعرض التعليمات البرمجية المصدر لصفحة ولكن تغيير وعرض هذه التغييرات مباشرة من خلال المتصفح.

مستخدمي جوجل كروم

لعرض التعليمات البرمجية المصدر لصفحة ويب في Google Chrome ، اتبع الخطوات أدناه.

1. اضغط على Ctrl + U على لوحة مفاتيح الكمبيوتر.

أو

أو

1. افتح Chrome وانتقل إلى صفحة الويب التي تختارها.
2. انقر فوق تخصيص والتحكم في Google Chrome
   
   أيقونة في الجانب العلوي الأيمن من نافذة المتصفح.
3. من القائمة المنسدلة التي تظهر ، حدد المزيد من الأدوات ثم أدوات المطور .
4. انقر فوق علامة تبويب " العناصر" في الجزء العلوي من القسم الجديد الذي يظهر.

نصيحة: باستخدام أحدث إصدارات Chrome ، فإن الضغط على المفتاح F12 أو Ctrl + Shift + I يعرض أيضًا أداة المطور التفاعلية. توفر هذه الأداة تفاعلًا أكبر بكثير مع الكود المصدري وإعدادات CSS ، مما يسمح للمستخدمين بمعرفة كيف تؤثر التغييرات في الكود على صفحة الويب فورًا.

مستخدمي أبل سفاري

لعرض التعليمات البرمجية المصدر لصفحة ويب في Apple Safari ، اتبع الخطوات أدناه.

1. اضغط على Command + Option + U على لوحة المفاتيح.

أو

أو

1. افتح متصفح Safari وانتقل إلى صفحة الويب التي تختارها.
2. حدد القائمة تطوير .
3. اختر خيار إظهار مصدر الصفحة .

مستخدمي أوبرا

لعرض التعليمات البرمجية المصدر لصفحة ويب في Opera ، اتبع الخطوات أدناه.

1. اضغط على Ctrl + U على لوحة المفاتيح.

أو

أو

1. افتح Opera وانتقل إلى صفحة الويب التي تختارها.
2. انقر فوق زر القائمة
   
   في الزاوية العلوية اليسرى من نافذة المتصفح.
3. في القائمة الفرعية Developer ، اختر مصدر الصفحة .

نصيحة: إذا كنت لا ترى القائمة الفرعية للمطورين ، فاختر المزيد من الأدوات → إظهار قائمة مطور البرامج . ثم ، انقر فوق زر القائمة

مرة أخرى. يجب أن تشاهد الآن قائمة المطور الفرعية المدرجة.

نصيحة: باستخدام أحدث إصدارات Opera ، يؤدي الضغط على مجموعة الاختصارات Ctrl + Shift + I إلى إظهار أداة المطور التفاعلية. توفر هذه الأداة تفاعلًا أكبر بكثير مع الكود المصدري وإعدادات CSS ، مما يسمح للمستخدمين بمعرفة كيف تؤثر التغييرات في الكود على صفحة الويب فورًا.

هاتف Android يشغل Chrome

1. افتح متصفح الإنترنت جوجل كروم على هاتفك.
2. افتح صفحة الويب التي ترغب في عرض شفرة المصدر الخاصة بها.
3. انقر مرة واحدة في شريط العناوين ، ثم انقل المؤشر إلى مقدمة عنوان URL.
4. اكتب view-source: واضغط على Enter أو Go .

نصيحة: على سبيل المثال ، لعرض رمز صفحتنا الرئيسية ، يمكنك كتابة view-source: //www.computerhope.com

كيفية إغلاق صفحة شفرة المصدر أو الأداة

بمجرد الانتهاء من عرض التعليمات البرمجية المصدر على صفحة ويب ، قد ترغب في الخروج أو إغلاقه. يعتمد إغلاق الكود المصدر على الطريقة التي استخدمتها لفتحه.

• إذا استخدمت طريقة Ctrl + U (باستثناء Edge) أو طريقة النقر بزر الماوس الأيمن ، فأغلق علامة التبويب الجديدة التي تم فتحها في الجزء العلوي من نافذة المتصفح.
• إذا استخدمت طريقة المطور (الضغط على F12 أو Ctrl + Shift + I) ، فانقر فوق
  
  في الزاوية العلوية اليمنى من نافذة الأدوات .