Атрибут id тега <dl>
Описание
Атрибут id задаёт уникальный идентификатор для элемента <dl> (списка определений), который может использоваться для стилизации, скриптов или якорных ссылок.
Важно: Значение id должно быть уникальным в пределах документа и не содержать пробелов.
Пример использования:
<dl id="html-glossary">
<dt>HTML</dt>
<dd>Язык гипертекстовой разметки</dd>
</dl>
<dl id="css-glossary">
<dt>CSS</dt>
<dd>Каскадные таблицы стилей</dd>
</dl>
Основные применения:
| Применение | Пример | Описание |
|---|---|---|
| CSS-стилизация | #html-glossary { border: 1px solid blue; } |
Стилизация конкретного списка |
| JavaScript-доступ | document.getElementById('html-glossary') |
Получение элемента для манипуляций |
| Якорные ссылки | <a href="#html-glossary">К глоссарию</a> |
Прямая ссылка на список |
Правила именования:
- Должен начинаться с буквы (A-Z, a-z)
- Может содержать цифры (0-9), дефисы (-), подчеркивания (_), точки (.)
- Чувствителен к регистру
- Должен быть уникальным в рамках документа
- Рекомендуется использовать осмысленные имена
Сравнение с классом:
| Критерий | id |
class |
|---|---|---|
| Уникальность | Должен быть уникальным | Может повторяться |
| CSS-специфичность | Высокая (#id) | Средняя (.class) |
| JavaScript | getElementById() | getElementsByClassName() |
| Назначение | Уникальные элементы | Группы элементов |
Рекомендации по использованию:
- Используйте для уникальных элементов страницы
- Избегайте избыточного применения (только когда действительно нужен уникальный идентификатор)
- Для стилизации предпочитайте классы, если элемент не уникален
- Придерживайтесь единого стиля именования в проекте
- Не используйте id для хранения данных (лучше data-*)
Пример с ARIA и доступностью:
<dl id="aria-glossary" aria-labelledby="glossary-heading">
<div id="glossary-heading">Глоссарий терминов</div>
<dt id="js-term">JavaScript</dt>
<dd aria-labelledby="js-term">Язык программирования для веб-страниц</dd>
</dl>
<style>
#aria-glossary {
border: 1px solid #ddd;
padding: 10px;
}
</style>
Ограничения и особенности:
- Браузеры обрабатывают id как глобальные переменные (не рекомендуется полагаться на это)
- Повторяющиеся id могут вызвать проблемы в JavaScript
- Специфичность в CSS может усложнить переопределение стилей
- Должны быть устойчивыми к изменениям (не должны часто меняться)
Примечание: Хотя атрибут id очень полезен для конкретных задач, его следует использовать осмысленно и умеренно. Для большинства случаев стилизации и групповых операций с элементами лучше подходят классы.