تخطَّ إلى المحتوى

<data>

وسم القيمة القابلة للقراءة الآلية <data>

وسم data يربط نصًّا يقرؤه البشر بقيمة يفهمها البرنامج عبر value — لكل بيانات المنتجات والمعرفات، وtime وحدها للتواريخ.

نظير time العام: time مخصص حصرًا للتواريخ والأوقات، بينما data لأي شيء آخر يحتاج ترجمة آلية موازية للنص المقروء — رمز منتج، رقم تصنيف، معرّف قاعدة بيانات. القيمة الآلية تعيش في خاصية value ولا تظهر للزائر، بينما محتوى الوسم هو ما يقرؤه.

مفيد خصوصًا حين يبني سكربت أو نظام فرز على القيمة دون أن يهم الزائر رؤيتها: قائمة منتجات تُرتّب برمجيًّا برقم SKU بينما يرى الزائر الاسم فقط.

الصياغة

<data value="398">صلصة الطماطم الصغيرة</data>

⚡ جرّب بنفسك

عدّل الكود واضغط «تحديث» لترى النتيجة فورًا — التجربة أفضل معلّم.

🎨 محرّر HTML/CSS
<ul>
  <li><data value="101">درس HTML الأول</data></li>
  <li><data value="102">درس HTML الثاني</data></li>
  <li><data value="103">درس HTML الثالث</data></li>
</ul>
<p style="font-size:13px; color:#666">القيمة الرقمية بـ value جاهزة لسكربت فرز أو بحث دون أن تظهر للزائر.</p>
النتيجة المباشرة:

أهم الخصائص

الخاصيةالوظيفة
valueالترجمة الآلية للمحتوى — رقم أو رمز يقرؤه السكربت لا الزائر

💡 نصائح عملية

  • محتوى الوسم تاريخ أو وقت؟ استخدم time بدله دائمًا — أكثر تحديدًا ودعمًا
  • قيمته الحقيقية عند بناء جداول تُفرز أو تُفلتر بجافاسكريبت اعتمادًا على value

⚠️ أخطاء شائعة

  • استخدامه للتواريخ بدل time — يخسر الدلالة الزمنية الصريحة
  • توقع ظهور value على الصفحة — لا يظهر؛ محتوى الوسم النصي هو الظاهر فقط

وسوم ذات صلة

🎓 تريد فهم الصورة الكاملة خطوة بخطوة؟ ابدأ من مسار HTML الكامل بالعربي.

📚 للتعمق التقني الكامل بالإنجليزية: MDN Web Docs