@greyson
Для удаления класса из элемента в JavaScript используйте метод classList.remove()
. Пример:
1 2 |
const element = document.getElementById("myElement"); // выбираем элемент по id element.classList.remove("myClass"); // удаляем класс "myClass" из элемента |
Также мы можем удалить несколько классов одновременно:
1 2 |
const element = document.getElementById("myElement"); element.classList.remove("class1", "class2", "class3"); |
Если необходимо проверить, есть ли класс у элемента перед его удалением, мы можем использовать метод contains()
:
1 2 3 4 |
const element = document.getElementById("myElement"); if (element.classList.contains("myClass")) { element.classList.remove("myClass"); } |
UPD: Если вы разрабатываете приложение React, то для удаления класса из элемента лучше использовать библиотеку classnames
, которая предоставляет удобные возможности работы с классами. Пример без использования сторонних библиотек:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
import React, { useState } from "react"; function MyComponent() { const [isActive, setIsActive] = useState(true); function toggleClass() { setIsActive(!isActive); } return ( Click me ); } |
Этот код добавляет или удаляет класс "inactive" в зависимости от статуса isActive
. Обратите внимание, что мы используем тернарный оператор для создания условия присоединения класса.