عالم البرمجة عالم البرمجة

مافائدة هاذه السمة

احمد • منذ 5 سنوات

السلام عليكم ورحمة الله وبركاته 

 

في هاذا الكود 

<ul>
  <li data-animal-type="bird">Owl</li>
  <li data-animal-type="fish">Salmon</li> 
  <li data-animal-type="spider">Tarantula</li> 
</ul>

 

يوجد كلمة data-animal 

كلمة data

ابغى اعرف ايش فائدتها 

وايش استخداماتها  يعني في ايش اقدر استخدمها 

 

 

 

كلمات دليلية: html php
أعجبني السؤال تابع السؤال شارك السؤال

ساعد بالإجابة

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

الإجابات (2)

Ali Majrashi • منذ 5 سنوات

وعليكم السلام ورحمة الله وبركاته 

نبسط data-* attribute على انها خاصية في html 5 تسمح لك بتخزين بيانات داخل اي عنصر من عناصر html في مثالك 

<ul>
  <li data-animal-type="bird">Owl</li>
  <li data-animal-type="fish">Salmon</li> 
  <li data-animal-type="spider">Tarantula</li> 
</ul>

فائدة هذا attribute انه يسمح لك تخزن بيانات زي مانت شايف ولا راح تظهر للمستخدم وتقدر تستفيد منها باستخدام JavaScript بحيث تقدر تاخذ القيمة المخزنة وتستخدمها باي عملية تحب بتلاحظ استخدامها بكثرة في بعض مكتبات جافاسكربت 

xlmnxp: او بالإمكان استخدامها في CSS

Nawaf Khalifah • منذ 5 سنوات
مميز

السلام عليكم ورحمة الله وبركاته
أسعد الله صباحك اخي الكريم،

قبل ان اجيب عن سؤالك أنصحك كثيرًا ان تقوم بالقراءة عن HTML5 وأحدث ميزاتها.

أولاً ماهي data-*؟
هي نوع من انواع ال Attributes (السمات) التي يمكن اسنادها إلى أي عنصر من عناصر HTML، وهي تستخدم لتعريف سمة خاصة للعنصر.

ماذا اعني بالسمات (Attributes)؟ لكل عنصر من عناصر HTML سماته الخاصة فمثلاً عنصر الصورة <img> لديه سمة خاصة تسمى src وتستخدم لوضع رابط او مسار الصورة.

ففي المثال الذي تفضلت ووضعته/

<ul>
  <li data-animal-type="bird">Owl</li>
  <li data-animal-type="fish">Salmon</li> 
  <li data-animal-type="spider">Tarantula</li> 
</ul>

كل عنصر من عناصر القائمة الغير منتظمة <ul> يمتلك سمة خاصة تسمى animal-type وكما تلاحظ فإن كل سمة خاصة تبدأ بـ data-.

ثانيًا الإستخدامات/

  • تستخدم لتخزين معلومات خاصة بالصفحة او التطبيق.
  • تمنحنا الامكانية لاسناد قيم خاصة لكل عنصر من عناصر HTML.
  • وبالتأكيد هذه القيم الخاصة يمكننا الوصول إليها من خلال JavaScript لتخدم احتياجاتنا.

اتمنى ان تكون الفكرة وصلت.
ان كانت اجابتي صحيحة فيرجى اختيارها.

 

تحياتي،

لايوجد لديك حساب في عالم البرمجة؟

تحب تنضم لعالم البرمجة؟ وتنشئ عالمك الخاص، تنشر المقالات، الدورات، تشارك المبرمجين وتساعد الآخرين، اشترك الآن بخطوات يسيرة !

اشترك الآن