Ответ
Фокус на форме означает, что элемент формы (например, инпут, кнопка) активен и готов принимать ввод от пользователя. Это состояние можно отслеживать и управлять им через JavaScript.
Пример:
const input = document.querySelector('input');
input.addEventListener('focus', () => {
console.log('Элемент получил фокус');
});
input.addEventListener('blur', () => {
console.log('Элемент потерял фокус');
});Особенности:
- Фокус можно установить программно через
element.focus() - Убирается через
element.blur() - Важно для доступности (screen readers)
- Можно стилизовать через псевдокласс
:focusв CSS
Ответ 18+ 🔞
А, ну это про фокус, да? Вот эта штука, когда ты по полю кликаешь и оно такое — готово, блядь, принимать твой бредовый ввод. Активно, сука. Состояние, которым можно рулить через JavaScript, как последним олигархом.
Вот смотри, как это выглядит в коде, тут всё просто, пиздец:
const input = document.querySelector('input'); // Нашли наш инпут, вот этот самый
// Когда на него навелись курсором и тыкнули — он в фокусе
input.addEventListener('focus', () => {
console.log('Элемент получил фокус'); // И он такой: "Я король, вводите даные, крестьяне!"
});
// А когда тыкнули мимо — он его теряет, обижается
input.addEventListener('blur', () => {
console.log('Элемент потерял фокус'); // И теперь он просто кусок HTML, грустит
});А теперь, внимание, ебать мои старые костыли, особенности, без которых нихуя не понять:
- Фокус можно впендюрить программно, командуй —
element.focus(). Как будто тыкнул, но пальцем не двигал, магия, блядь. - И отобрать так же —
element.blur(). "А ну пошёл вон из активного состояния, тварь!" - Для доступности это овердохуища важно — скринридеры кричат пользователям, где они сейчас, а то заблудятся, бедолаги.
- И, конечно, можно нарядить это состояние через CSS-псевдокласс
:focus. Подсветить, обвести, сделать красиво, чтобы пользователь вообще не сомневался, куда он сейчас свои циферки вбивает.