Свойство dataset

В языке HTML разрешено добавлять свои атрибуты тегам, при этом они должны начинаться с data-, а затем должно идти любое название атрибута. Для обращения к таким атрибутам через JavaScript используется специальное свойство dataset.

Синтаксис

элемент.dataset.имя;

Пример

Давайте прочитаем значение атрибута:

<div data-cost="1000"></div>

let elem = document.querySelector('div');
let res = elem.dataset.cost;

console.log(res);

Результат выполнения кода:

'1000'

Пример

Давайте изменим значение атрибута:

<div data-cost="1000"></div>

let elem = document.querySelector('div');
elem.dataset.cost = '2000';

В результате код станет выглядеть так:

<div data-cost="2000"></div>

Смотрите также

метод getAttribute,
который получает атрибуты
метод setAttribute,
который записывает атрибуты