Как удалить класс в js

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

при клике на ссылку должен появляться класс active, при нажатии на другой элемент списка он должен удаляться у прежнего. Реализовал добавление и удаление класса при нажатии на сам элемент а как сделать переход класса на другой не могу догнать. Спасибо за помощь

let List = document.querySelectorAll('.CatalogMenu li a') List.forEach(item =>< item.addEventListener('click', (e) =>< item.classList.toggle('active') >) >)

• Вопрос задан более трёх лет назад
• 7275 просмотров

Комментировать

Решения вопроса 1

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') >) >)

Ответ написан более трёх лет назад

Нравится 12 7 комментариев

Убираем класс с помощью classList.remove

Мы убедились, что JavaScript действительно нашёл элемент с классом page . Пора заняться переключением тем. У найденного элемента есть ещё второй класс — light-theme , благодаря ему на странице включена светлая тема. Чтобы не было смешения стилей, когда мы переключим тему, этот класс у элемента нужно убрать. Для этого нам понадобится метод classList.remove . Используют его так:

элемент.classList.remove('класс');

Метод убирает с элемента тот класс, который указан в скобках. Обратите внимание, что мы не ставим точку перед именем класса в classList.remove . Это не селектор, JavaScript и так знает, что мы имеем дело с классом.

Обратите внимание, что буква «L» в названии метода заглавная. JavaScript чувствителен к регистру. Если написать classlist.remove , метод не сработает.

Чтобы выключить светлую тему, убрав класс light-theme у элемента page , используем инструкцию:

document.querySelector('.page').classList.remove('light-theme');

Получился такой «паровозик»: найди элемент, а потом убери у него класс. Давайте посмотрим, что произойдёт, когда эта инструкция выполнится:

Давайте выключим светлую тему с помощью JavaScript!

Перейти к заданию

• index.html Сплит-режим
• style.css Сплит-режим
• script.js Сплит-режим