@ComPUCKter
Вечный ж..студент

Как при нажатии на один объект в ul удалить классы у остальных объектов?

Есть навбар, в котором несколько элементов. Мне нужно, чтобы при нажатии на одного из них на нажатом появлялся класс active (это я уже сделал), а у остальных он удалялся.

Вот мой код
const navigation = document.querySelector('.header__navigation');

navigation.addEventListener('click', (event) => {
   const target = event.target;

   // navigation.removeClass('active');
   target.classList.add('active');
});
  • Вопрос задан
  • 29 просмотров
Решения вопроса 1
Seasle
@Seasle Куратор тега JavaScript
\( ゚ヮ゚)/
Вариант 1:
const navigation = document.querySelector('.header__navigation');

navigation.addEventListener('click', (event) => {
    const activeElements = navigation.querySelectorAll('.active');
    for (const activeElement of activeElements) {
        activeElement.classList.remove('active');
    }

    event.target.classList.add('active');
});

Вариант 2:
const navigation = document.querySelector('.header__navigation');
const items = navigation.querySelectorAll('YOUR_SELECTOR'); // Элементы, у которых должен быть класс active

for (const item of items) {
    item.addEventListener('click', () => {
        for (const item of items) {
            item.classList.remove('active');
        }

        item.classList.add('active');
    });
}
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы