Атрибут data-* тега <strike>
Описание
Атрибуты data-* позволяют хранить дополнительную информацию в элементе <strike>. Эти пользовательские атрибуты не влияют на отображение, но могут быть использованы в JavaScript и CSS.
Обратите внимание: Тег
Пример использования:
<strike> считается устаревшим в HTML5. Для современных проектов лучше использовать <del> или <s> с атрибутами data-*.
<strike
data-original-price="5000"
data-discount="20"
data-currency="RUB">
4000 руб.
</strike>
Синтаксис атрибутов data-*:
| Формат | Пример | Описание |
|---|---|---|
data-имя="значение" |
data-id="123" |
Простое значение |
data-составное-имя="значение" |
data-user-role="admin" |
Составное имя (дефисы вместо camelCase) |
data-json='{"ключ":"значение"}' |
data-options='{"expired":true}' |
Сложные данные в JSON |
Пример доступа через JavaScript:
<strike id="price" data-original="7500" data-discount="25%">
5625 руб.
</strike>
<script>
const priceElem = document.getElementById('price');
const original = priceElem.dataset.original; // "7500"
const discount = priceElem.dataset.discount; // "25%"
console.log(`Скидка ${discount} от ${original} руб.`);
</script>
Пример использования в CSS:
<style>
strike[data-important="true"] {
color: red;
font-weight: bold;
}
</style>
<strike data-important="true">Важная уценка</strike>
Рекомендации:
- Используйте осмысленные имена атрибутов
- Храните только строковые данные (для сложных структур используйте JSON)
- Придерживайтесь именования через дефисы (data-user-name, не dataUserName)
- Для современных проектов применяйте data-* с
<del>вместо<strike>
Ограничения:
- Значения всегда строковые (нужно преобразовывать числа/булевы)
- Не предназначены для хранения больших объемов данных
- Доступ через dataset не поддерживается в очень старых браузерах