HTML

HTML Comments
التعليقات في لغة HTML

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

التاريخ

03 يناير 2021

الدروس

48

المستوى

مبتدئ

اللغة

عربي

المشاهدات

13421

المواضيع

12
الشروحات chevron_left HTML Comments chevron_left HTML

HTML Comments
التعليقات في لغة HTML

</> HTML comments
التعليقات في لغة HTML

هي معلومات تنظيمية حول صفحة الويب تمكّن مطوري المواقع من معرفة خارطة الأكواد البرمجية داخل صفحة HTML، فمثلًا: يقوم المطور بإضافة تعليق "comment" عند بداية الصفحة ونهايتها، ويكتب Start of page و End of page.


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

كما تستخدم التعليقات "comments" في تعطيل أي جزء من أجزاء عناصر HTML ومنع ظهوره على المتصفح وعدم تنفيذه، كأن يقوم المطور بتجربة تقسيمة الصفحة بدون العناصر المهمشة عن طريق التعليقات للمقارنة.

يمكن إضافة عدد غير محدود من التعليقات "comments" داخل صفحة HTML وفي أي مكان.


لماذا نستخدم التعليقات في لغة HTML؟

  • لعمل توثيق كامل لخارطة الأكواد البرمجية "documentation"، مما يساعد المطورين في فهم خارطة الأوامر البرمجية.
  • لسهولة قراءة الأوامر البرمجية وعدم تداخلها، وهي أيضًا عملية تنظيمية يستخدمها أغلب مطوري الويب.
  • لوصف النتيجة المقصودة من الأوامر البرمجية أو لشرح سبب استخدام هذا الأمر البرمجي أو لتوضيح سطر معقد.
  • أي نص أو عنصر تقوم بوضعه داخل تعليق "comment" داخل صفحة HTML، لا يظهر على المتصفح؛ لأن المتصفحات تتجاهل تعليقات HTML Comments" HTML ".

  • بينما يمكن أن تكون التعليقات مفيدة في شرح الأوامر البرمجية، يجب استخدامها بحكمة؛ فالتعليقات الكثيرة جدًا أو التعليقات المكتوبة بشكل سيئ يمكن أن تجعل قراءة وفهم الكود أكثر صعوبة.

</> HTML comments syntax
طريقة كتابة التعليقات في لغة HTML

تتألف عناصر التعليقات من الأجزاء التالية:

  • open tag: يتكون من علامة أصغر من ثم علامة تعجب ثم علامتي dash أو علامتي minus [  --!> ] .
  • close tag: تبدأ بعلامتي dash أو علامتي minus وتنتهي بعلامة أكبر من  [  <-- ] .   
  • content: يكون نص أو عنصر أو أكثر.
HTML comments syntax

طريقة كتابة التعليقات "Comments" في لغة HTML.

<!-- Comments are not displayed in the browser -->
Add a comment

يمكنك إضافة تعليق في أي مكان داخل صفحة HTML.

<!-- This is a comment -->
<p>This is a paragraph.</p>
<!-- Comments are not displayed in the browser -->
ملاحظة

لا تظهر تعليقات HTML Comments" HTML " على المتصفح، لكن ضع في اعتبارك أنه يمكن لأي شخص عرض جميع عناصر HTML على المتصفحات من خلال الاختصار ctrl+u وهذا يشمل أيضًا جميع التعليقات التي تمت كتابتها بداخل أكواد تصميم الواجهة الأمامية للموقع.

</> single-line comment in HTML
كتابة تعليق سطر واحد في HTML

قد يتكون التعليق من سطر واحد أي يمتد على سطر واحد فقط، ولن يتم عرض هذا السطر على المتصفح.

single-line comments in HTML

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

<body>
    <!-- Add the navbar here -->
    <h1>About me</h1>
    <p>I am learning to code with closeTag.</p>
    <p>I am going through each and every one of their awesome and super helpful certifications. </p>
    <p>I am on my way to becoming a fullstack web developer!</p>
    <h2>Work Experience</h2>
</body>

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

</> Nested comments in HTML
التعليق المُتداخل في HTML

يمكنك إضافة تعليقات في منتصف جملة أو سطر من التعليمات البرمجية، سيتم إضافة التعليق على النص الموجود داخل  [ <! -  -> ] فقط، ولن يتأثر باقي النص الموجود خارج العلامة، بمعنى أن المتصفح لن يظهر هذا الجزء من الكود.

Nested comments in HTML

إضافة تعليقات في منتصف جملة أو سطر من التعليمات البرمجية.

<p>I am <!--going to be--> a web developer</p>

</> multi-line comment in HTML
كتابة تعليق متعدد الأسطر في لغة HTML

يمكن أن تمتد التعليقات لعدّة سطور باستخدام نفس الصيغة.

لكن يجب عليك مراعاة علامة البدء "open tag" عند بداية أول سطر، وعلامة الإغلاق "close tag" عند نهاية آخر سطر.

multi-line comments in html

يمكن أن تمتد التعليقات لعدّة أسطر,

<!-- This is going to be my portfolio.
    It will show off the projects that I'm most proud of.
    I could go on and on about what I want to add
    because I am writing a multi-line comment here -->

</> Comments keyboard shortcut in HTML
اختصارات لوحة المفاتيح لإضافة التعليقات في لغة HTML

يمكنك استخدام اختصارات التعليقات في لوحة المفاتيح "Keyboard" لإضافة التعليقات، وستحتاج إلى استخدام هذه الاختصارات كثيرًا، وهذه الاختصارات هي:

  • [ /  cmd ] لمستخدمي Mac.
  • [ /  Ctrl ] لمستخدمي Windows و Linux.

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

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

مصطلحات الدرس
HTML Comments
HTML Comments

تعليقات HTML

Comments
Comments

تعليقات

Start Of Page
Start Of Page

بدء الصفحة

End Of Page
End Of Page

نهاية الصفحة

Element
Element

عنصر

Open Tag
Open Tag

علامة الفتح

Close Tag
Close Tag

علامة الإغلاق

Content
Content

محتوي

Minus
Minus

علامة الناقص

Places
Places

أماكن

Comments Places
Comments Places

أماكن التعليقات

اختصارات الدرس
HTML
HTML

Hypertext Markup Language

لغة توصيف النص الفائق الخاصة ببناء صفحة الإنترنت
معلومات تهمك
  • لا تنسى تقييم الدروس لكي نُحدّث المُحتوى باستمرار حتى ينال إعجابك.
  • لا تنسى مشاركة الموقع مع أصدقاءك حتى تعمّ الفائدة وتكون سبب في نفعهم.
مشاركة
0
0
0
0
عدد المشاركات
هل هذه المعلومات نالت إعجابك ؟
0
0
عدد التقييمات

لديك استفسار ؟

يسعدنا كثيرا مساعدتك في استيعاب افضل للأمور, فلا تترد مطلقا في الاتصال بنا في حال كانت لديك اية اسئله او استفسارات.