ما هي سمة المعرف في HTML وكيف يتم استخدامها؟

وفقا ل W3C، سمة المعرف بتنسيق لغة البرمجة هو معرف فريد للعنصر. يوفر طريقة لتحديد منطقة من صفحة الويب لأنماط CSS وروابط الربط وأهداف البرامج النصية.

ما هي سمة المعرف المستخدمة؟

تنفذ سمة المعرف عدة إجراءات لصفحات الويب:

  • محدد ورقة الأنماط: هذه هي الوظيفة التي يستخدمها معظم الأشخاص لسمة المعرف. نظرًا لأنها فريدة من نوعها ، ستقوم بنمط عنصر واحد فقط على صفحة الويب الخاصة بك عند النمط باستخدام خاصية المعرف. الجانب السلبي لاستخدام المعرف لأغراض التصميم هو أنه يتمتع بمستوى عالٍ جدًا من الخصوصية ، مما قد يجعل الأمر صعبًا للغاية إذا كنت بحاجة إلى تجاوز نمط لسبب ما لاحقًا في ملف ورقة الأنماط. لهذا السبب ، تميل ممارسات الويب الحالية نحو استخدام الفئات ومحددات الفئة بدلاً من معرفات ومحددات المعرفات لأغراض التصميم العامة.
  • المراسي المسماة للارتباط بـ: متصفحات الانترنت استهدف مواقع دقيقة في مستندات الويب الخاصة بك عن طريق الإشارة إلى المعرف في نهاية عنوان URL. أضف المعرف إلى نهاية عنوان URL للصفحة ، مسبوقًا بعلامة تجزئة. اربط هذه الروابط بالصفحة نفسها عن طريق إضافة علامة التجزئة واسم المعرف في ملف href السمة للعنصر. على سبيل المثال ، لقسمة بمعرف من اتصل، اربطه في تلك الصفحة بـ #اتصل.
  • instagram viewer
  • مرجع للنصوص: إذا قمت بكتابة أي من وظائف Javascript ، فاستخدم سمة ID بحيث يمكنك إجراء تغييرات على العنصر المحدد في الصفحة باستخدام البرامج النصية الخاصة بك.
  • معالجة أخرى: المعرف يدعم المعالجة داخل مستندات الويب الخاصة بك بأي طريقة تريدها. على سبيل المثال ، يمكنك استخراج HTML إلى قاعدة بيانات واستخدام سمة المعرف لتعريف الحقول.

قواعد استخدام سمة المعرف

تأكد من أن سمات معرفك تتوافق مع هذه المعايير الثلاثة:

  • يجب أن يبدأ المعرّف بحرف (a-z أو A-Z).
  • يمكن أن تكون جميع الأحرف التالية أحرفًا وأرقامًا (0-9) وواصلات (-) وشرطات سفلية (_) ونقطتين (:) ونقاط (.).
  • يجب أن يكون كل معرف فريدًا داخل المستند.

استخدام سمة المعرف

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

على سبيل المثال ، لتحديد معرّف بعنوان اتصل، استخدم أيًا من هذه النماذج:

div # contact {background: # 0cf؛} 
#contact {background: # 0cf؛}

يستهدف النموذج الأول قسمًا له سمة ID اتصل. الثاني لا يزال يستهدف العنصر بمعرف اتصل، لن يشترط أنها قسمة. ستكون النتيجة النهائية للتصميم هي نفسها تمامًا.

يمكنك أيضًا الارتباط بهذا العنصر المحدد دون إضافة أي علامات.

قم بالإشارة إلى تلك الفقرة في نصوصك بامتداد getElementById طريقة JavaScript:

document.getElementById ("قسم الاتصال")

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

instagram story viewer