Data-атрибутҳо дар HTML барои чӣ истифода мешаванд…

Data-атрибуттар (data-*) HTML элементтер жөнүндө кошумча, стандарттык эмес маалыматтарды кармоого мүмкүндүк берет, башка атрибуттарды түздөн-түз колдонбостон же DOM түзүмүн өзгөртпөстөн.

Алар пайдалуу:

JavaScript үчүн маалымат сактоо: JavaScript оңой эле бул маалыматтарды алууга жана динамикалык жүрүм-турум, элемент менен өз ара аракеттенүү же колдонмо бөлүктөрү арасында маалымат алмашуу үчүн колдонууга болот.
```
<div id="user-profile" data-user-id="123" data-user-role="admin">
    Салам, admin!
</div>
```
```
// data-атрибуттардан маалымат алуу
const userProfile = document.getElementById('user-profile');
const userId = userProfile.dataset.userId; // "123"
const userRole = userProfile.dataset.userRole; // "admin"
```
Колдонуучунун өзгөчө атрибуттарын түзүү: HTML спецификациясына ылайык келбеген өзгөчө атрибуттарды ойлоп табуудан алыс, data-* колдонулат, бул кодду семантикалык жана валиддүү кылат.

Стилдөө: CSS-селекторлор аркылуу атрибуттар боюнча элементтерди алардын data- атрибуттарындагы маанилерине ылайык стилизациялоо мүмкүн.

<button data-status="active">Активдүү баскыч</button>
<button data-status="inactive">Иштелбеген баскыч</button>

/* data-атрибут боюнча стилизация */
button[data-status="active"] {
    фон-боёгу: жашыл;
}

button[data-status="inactive"] {
    фон-боёгу: сүрөттөлгөн;
}

Фреймворктор жана китепканалар: Көптөгөн фронтенд-фреймворктор жана китепканалар data- атрибуттарды компоненттерди баштоо, параметрлерди өткөрүү же маалыматтарды байланыштыруу үчүн колдонушат (мисалы, Vue.js v-bind менен же React data- атрибуттары менен үчүнчү тарап китепканаларын интеграциялоо).
Микроформаттар жана структураланган маалыматтар: Кээде data- атрибуттар микроформаттарды киргизүү же машиналар түшүнүүчү маалыматтарды белгилөө үчүн колдонулушу мүмкүн.

Жалпысынан, data- атрибуттар HTML элементтеринде кошумча маалыматтарды сактоонун ийкемдүү жана стандарттык ыкмасын камсыз кылат, бул JavaScript жана CSS аркылуу алардын менен иштөөдө жеңилдик берет.

Data-атрибутҳо дар HTML барои чӣ истифода мешаванд?