Привет всем! У меня есть вопрос по работе с JavaScript. Мне нужно научиться менять класс у HTML-элементов когда происходят разные события на странице. Например, когда пользователь кликает на кнопку или наводит мышку на блок. Я пробовал разные способы но пока не получается сделать это правильно. Может кто-то объяснит как это работает? Буду очень благодарен за помощь и примеры кода если есть возможность.
Можно еще проверить, есть ли класс с помощью element.classList.contains('имя-класса')
- это возвращает true или false. Удобно для условий. Какие именно события тебе нужны? Для клика это просто addEventListener('click', function(){})
, а для наведения мыши - mouseenter
и mouseleave
.
Для смены CSS-классов используй classList
- он намного удобнее. element.classList.add('новый-класс')
добавляет класс, element.classList.remove('старый-класс')
убирает его. Есть еще element.classList.toggle('класс')
- переключает класс туда-сюда. Можешь использовать element.className = 'новое-значение'
, но осторожно - это сотрет все остальные классы. Лучше stick с classList
.