HTML-тег <label>

Характеристики

• Тип: строчный, интерактивный, семантический
• Назначение: Предоставляет подпись для элемента интерфейса пользователя.
• Родители: Любые HTML-теги, которые могут содержать строчные элементы.
• Потомки: Текст и элементы формы.
• Глобальные атрибуты: все
• Атрибуты событий: все

Атрибуты

• for — связывает &lt;label&gt; с элементом формы по его id.
• form — связывает &lt;label&gt; с формой, если он находится вне её.

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

<label id="myLabel" for="myInput">Имя пользователя:</label>
<input id="myInput" type="text" name="username">

Использование в JavaScript

// Получение элемента по ID
const label = document.getElementById('myLabel');

// Изменение текста
label.innerHTML = 'Новая метка';

// Добавление класса
label.classList.add('new-class');

Рекомендации по обеспечению доступности (a11y)

• Всегда связывайте <label> с соответствующим элементом формы с помощью атрибута for.
• Это улучшает доступность для пользователей экранных читалок и других вспомогательных технологий.

Полезные ссылки