Атрибут data-* тега <s>

Описание

Атрибуты data-* позволяют хранить дополнительную информацию в элементе <s>, невидимую для пользователей, но доступную для JavaScript и CSS. Особенно полезны для отметки причин зачёркивания текста.

Пример использования:
<s data-reason="obsolete" data-date="2025-11-15"> Устаревшая информация, актуальная до 2022 года </s>

Типичные data-атрибуты для <s>:

Атрибут Пример значения Назначение
data-reason "obsolete", "incorrect", "replaced" Причина зачёркивания
data-date "YYYY-MM-DD" Дата устаревания
data-author "user123" Кто отметил как устаревшее

Пример обработки через JavaScript:

<s data-status="deprecated" data-replacement-id="new-info-1"> Старая версия контента </s> <script> const strikethrough = document.querySelector('[data-status="deprecated"]'); console.log('Причина:', strikethrough.dataset.status); console.log('Заменён на:', strikethrough.dataset.replacementId); </script>

Стилизация на основе data-атрибутов:

<style> s[data-reason="obsolete"] { background-color: #fff3f3; } s[data-reason="updated"] { background-color: #f3f3ff; } </style> <s data-reason="obsolete">Устаревшие данные</s> <s data-reason="updated">Обновлённая информация</s>

Рекомендации по использованию:

  • Используйте для хранения метаданных о причинах правок
  • Применяйте единый формат именования атрибутов
  • Храните только строковые значения (для сложных данных используйте JSON)
  • Избегайте избыточного количества data-атрибутов
Совет: Для сложных сценариев можно использовать JSON в data-атрибуте: <s data-meta='{"reason":"obsolete","author":"admin"}'>...</s>