Задать вопрос
@Dryzhkov

Как удалить класс при клике на другой элемент?

Всем привет! Изучаю js и столкнулся с такой проблемой :
есть список:
<ul class="CatalogMenu">
            <li>
                <a href="#">
                    Все кухни
            </a>
            </li>
            <li>
                <a href="#">
                    Новинки
                </a>
            </li>
            <li>
                <a href="#">
                    Классические
                </a>
            </li>
            <li>
                <a href="#">
                    Современные
                </a>
            </li>
            <li>
                <a href="#">
                    Готовые кухни
                </a>
            </li>
        </ul>


при клике на ссылку должен появляться класс active, при нажатии на другой элемент списка он должен удаляться у прежнего. Реализовал добавление и удаление класса при нажатии на сам элемент а как сделать переход класса на другой не могу догнать. Спасибо за помощь
let List = document.querySelectorAll('.CatalogMenu li a')
 List.forEach(item =>{
        item.addEventListener('click', (e) =>{
            item.classList.toggle('active')
        })
    })
  • Вопрос задан
  • 7855 просмотров
Подписаться 1 Средний Комментировать
Решения вопроса 1
@Steppp
html классы писать с маленькой буквы через - разделять слова
js все переменные начинаются с маленькой буквы слова слитно начиная с большой буквы. Как в html классы
const list = document.querySelectorAll('.CatalogMenu li a')
 list.forEach(item =>{ 
        item.addEventListener('click', (e) =>{
        list.forEach(el=>{ el.classList.remove('active'); });
        item.classList.add('active')
    })
})
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

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

Похожие вопросы
Rocket Смоленск
от 80 000 до 130 000 ₽
div. Ставрополь
от 40 000 до 90 000 ₽
Wanted. Санкт-Петербург
До 220 000 ₽
18 дек. 2024, в 14:45
25000 руб./за проект
18 дек. 2024, в 14:43
25000 руб./за проект
18 дек. 2024, в 14:22
750 руб./за проект