Проверьте, имеет ли элемент HTML класс
Добавить в избранное
В JavaScript есть несколько способов проверить, имеет ли элемент указанный класс. Один из способов - использовать свойство classList элемента. Свойство classList является объектом DOMTokenList, который представляет список классов, назначенных элементу. Метод contains() объекта DOMTokenList возвращает значение true, если элемент содержит указанный класс.
Вот пример того, как использовать свойство classList и метод contains() для проверки, имеет ли элемент указанный класс:
// Пример
hasClass(document.querySelector('p.special'), 'special'); // true
В этом примере функция hasClass() принимает два аргумента: элемент и имя класса. Функция возвращает значение true, если элемент содержит указанный класс, и значение false, если элемент не содержит указанный класс.
В примере выше мы используем метод querySelector() для получения элемента с классом special. Затем мы передаем элемент и имя класса функции hasClass(). Функция hasClass() использует метод contains() объекта classList элемента для проверки, содержит ли элемент указанный класс.
Вот еще один способ проверить, имеет ли элемент указанный класс:
// Пример
hasClass(document.querySelector('p.special'), 'special'); // true
В этом примере функция hasClass() использует метод toString() объекта classList элемента для получения строки, содержащей все классы, назначенные элементу. Затем функция использует метод includes() для проверки, содержит ли строка указанный класс.
Пример использования функции hasClass()
<p class="important">Этот абзац имеет класс "important".</p>
<script>
const hasClass = (el, className) => el.classList.contains(className);
const p1 = document.querySelector('p.special');
const p2 = document.querySelector('p.important');
console.log(hasClass(p1, 'special')); // true
console.log(hasClass(p2, 'important')); // true
console.log(hasClass(p2, 'special')); // false
</script>
В этом примере мы используем функцию hasClass() для проверки, имеют ли два абзаца указанные классы. В первом выводе мы видим, что первый абзац имеет класс special. Во втором выводе мы видим, что второй абзац имеет класс important. В третьем выводе мы видим, что второй абзац не имеет класса special.
Свойство classList и метод contains() являются удобными способами проверить, имеет ли элемент указанный класс в JavaScript.