Комментарии 18
В свое время, работа с «data-» стала для меня откровением, сейчас без этого сложный дизайн не сверстать. Благодарю за статью, интересно и освежил память)
А можно пример, который проще\лучше сделать на data-*, чем на классах?
Так data-* и не должна использоваться в CSS, этот тег придумали для бъединения JS и HTML, а то что используют CSS селекторы атрибутов, вместо классов, то можно руки поотрывать, не спорю, есть некоторые моменты, в которых, без атрибутных селекторов, не обойтись, но их на сайте должно быть еденицы.
data-theme='dark' на html и css vars в зависимости от data-theme — почти в каждой статье о темах, модно-молодёжно.

А .theme-dark чем не устраивает модных и молодёжных фронтдендеров?
Вон, в бутстрапе пресловутом примерно так же реализовано.

<tr data-id="12345"><td>Селиван Сталлоне</td></tr>
<tr data-id="12346"><td>Галина Гадот</td></tr>

var ids = querySelectorAll('tr[data]');
cosnsole.log( ids[0].dataset.id ); // 12345
НЛО прилетело и опубликовало эту надпись здесь
можно
цель примера — показать с помощью минимального кода что это массив

Когда-то, как PoC, сделал на них SPA без JS стейта. То есть все данные приложения лежали в атрибутах. Локальные переменные в хендерах были, но без долгоживущих замыканий. В принципе работало, но тормозило на каждый чих DOM менять

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

Статья как нельзя кстати подошла. Помогла быстро решить проблему реализации DND — отделить мух от котлет дроп просто в контейнер или дроп на существующие элементы контейнера!

Тема действительно не распространенная, что странно. Поддержка браузерами заявлена широкая.

Годная статья, но я бы верблюжий регистр оставил как CamelCase.

Только полноправные пользователи могут оставлять комментарии. Войдите, пожалуйста.

Информация

Дата основания
Местоположение
Россия
Сайт
ruvds.com
Численность
11–30 человек
Дата регистрации

Блог на Хабре