Для чего нужны data-атрибуты?

Question

Data-атрибуты — это пользовательские атрибуты, начинающиеся с data-, которые позволяют хранить дополнительные данные в HTML-элементах. Эти данные могут быть использованы JavaScript для динамической обработки элементов на странице. Data-атрибуты удобны для передачи данных без необходимости изменения структуры HTML или использования скрытых полей.

YeaHub · Accepted Answer

Data-атрибуты — это механизм хранения пользовательских данных в HTML-элементах с помощью атрибутов, начинающихся с data-. Например, data-id, data-name, и т.д. Эти атрибуты не влияют на отображение контента, но позволяют хранить информацию, которую можно легко извлечь с помощью JavaScript и использовать для работы с элементами страницы.Пример использования:В этом примере кнопка содержит два data-атрибута: data-product-id и data-category. JavaScript может получить доступ к этим значениям следующим образом:const button = document.querySelector('button'); const productId = button.getAttribute('data-product-id'); console.log(productId); // 12345Data-атрибуты удобны для передачи информации от HTML в JavaScript без необходимости использовать дополнительные элементы или усложнять HTML-разметку. Они активно применяются в динамических интерфейсах, для управления событиями и хранения уникальных данных, связанных с элементом.