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

Описание

Пользовательские атрибуты data-* для тега <bdo> позволяют хранить дополнительную информацию, связанную с элементом. Эти атрибуты особенно полезны для:

  • Хранения метаданных о направленном тексте
  • Интеграции с JavaScript-логикой
  • Передачи параметров для обработки RTL/LTR-контента

Пример использования:

<bdo dir="rtl" data-original-direction="ltr" data-lang="he"> עברית </bdo>

Типичные сценарии применения:

Атрибут Назначение Пример значения
data-original-direction Исходное направление текста "ltr", "rtl", "auto"
data-lang Язык содержимого "ar", "he", "fa"
data-content-type Тип контента "name", "quote", "term"

Доступ через JavaScript:

const element = document.querySelector('bdo[dir="rtl"]'); console.log(element.dataset.originalDirection); // "ltr" console.log(element.dataset.lang); // "he" // Динамическое изменение element.dataset.processed = "true";

Особенности работы:

  • Не влияют на отображение направления текста
  • Доступны через свойство dataset в JavaScript
  • Поддерживают любые пользовательские названия после префикса data-
  • Могут использоваться в CSS через селекторы атрибутов

Пример с CSS-селекторами:

/* Стилизация для арабского контента */ bdo[data-lang="ar"] { font-family: 'Traditional Arabic', serif; color: #2a5db0; } /* Индикация обработанного текста */ bdo[data-processed="true"]::after { content: " ✓"; color: green; }

Совет: Для сложных структур данных используйте JSON в одном data-атрибуте: data-meta='{"original":"Hello","processed":true}'

Рекомендации:

  • Используйте осмысленные имена data-атрибутов
  • Для RTL-контента сохраняйте семантику через dir и lang
  • Избегайте хранения больших объемов данных
  • Проверяйте валидность JSON при парсинге сложных данных