چه زمانی data_attribute را در HTML استفاده میکنیم ؟

HTML syntaxSection:

نحو ساده است. هر ویژگی در هر عنصر که نام ویژگی آن با داده شروع می شود، یک data_attribute است. شما یک مقاله دارید و می خواهید یک اطلاعات اضافی را ذخیره کنید که هیچ تصویر نمایشی نداشته باشد. فقط از data_attribute برای آن استفاده کنید:

JavaScript accessSection:

خواندن مقادیر این صفات در JavaScript نیز بسیار ساده است. شما می توانید از getAttribute () با نام کامل HTML خود برای خواندن آنها استفاده کنید، اما استاندارد یک راه ساده تر را تعریف می کند: یک DOMStringMap که می توانید با استفاده از یک ویژگی data set خواند.

برای به دست آوردن یک ویژگی داده از طریق شیء داده، اموال را بخشی از نام attribute بعد از data دریافت کنید (توجه داشته باشید که خط تیره به camelCase تبدیل می شود).

در مورد فوق، قسمت article.dataset.columns = 5 این خصوصیت را به "5" تغییر میدهد.

CSS access:

توجه داشته باشید که data_attributes ویژگی های HTML ساده است، شما حتی می توانید از CSS به آنها دسترسی پیدا کنید. به عنوان مثال برای نشان دادن اطلاعات پدر و مادر در مقاله شما می توانید محتوای تولید شده در CSS با استفاده از attr () تابع:

شما همچنین می توانید انتخابگرهای attribute را در CSS برای تغییر سبک با توجه به داده ها استفاده کنید:

همچنین data_attribute ها می توانند ذخیره شوند تا حاوی اطلاعاتی باشند که دائما در حال تغییر هستند مانند امتیاز در یک بازی. با استفاده از انتخابگرهای CSS و دسترسی به جاوا اسکریپت این اجازه را می دهد تا شما برای ساختن برخی از افکت های بسیار زیبا بدون نیاز به نوشتن روال های صفحه نمایش خود باشید.

برای فهم بیشتر بر روی لینک زیر کلید کرده و کلیپ رو مشاده کنید

با تشکر فراوان خدمت استاد گرامی جناب آقای دکتر احمد ابریشمی

نام دانشجو : دانیال کفائی نژاد طهرانی

دانشکده فنی و حرفه ای شهید شمسی پور