35. خصائص البيانات والعناصر المخصصة

35.1 خصائص البيانات المخصصة (data-*)

تحتاج أحياناً إلى تخزين بيانات إضافية على عناصر HTML القياسية تكون غير مرئية للمستخدم ولكن يمكن الوصول إليها بواسطة JavaScript. تسمح لك بادئة الخاصية data-* بالقيام بذلك دون إبطال (invalidating) كود HTML الخاص بك.

html

أضف إلى السلة

الاستخدام: يمكن لـ JavaScript استرداد هذه المعلومات بسهولة لإدارة عربات التسوق أو تتبع سلوك المستخدم أو تغيير حالة المكون.

35.2 فهم العناصر المخصصة (نظرة مستقبلية)

بينما يتم إنشاء العناصر المخصصة بشكل أساسي باستخدام JavaScript (Web Components)، تدعم HTML الهيكل.

تسمح العناصر المخصصة للمطورين بتعريف وسومهم الخاصة (على سبيل المثال، <my-alert> أو <user-card>)، مما يعزز قابلية إعادة الاستخدام والكود النظيف. يجب أن تحتوي على شرطة واصلة في الاسم.

html

هنا يبدأ سحر Web Components، الذي يربط بين HTML و JS المتقدمة.