Я хочу переключить класс на элемент тега html. Я сделал его работу с элементом body, но я не могу найти решение для переключения класса в тег html.
document.querySelector('[data-menu-mobile]').addEventListener('click', function(){
document.body.classList.toggle('nav-main-mobile-open');
document.html.classList.toggle('html-color-fill');
});
Я знаю, что это кажется неправильным:
document.html.classList.toggle('html-color-fill');
Каков правильный способ сделать это?
Нет объекта document.html
, чтобы перейти к корневому элементу, вы должны использовать document.documentElement
.
document.documentElement.classList.toggle('html-color-fill')
document.documentElement
- это независимый от языка разметки способ получения корневого элемента, в то время как document.body
является специфичным для HTML дополнением к DOM API.
Это должно работать:
var elements = document.getElementsByClassName("myclass");
//iterate through all found elements
Array.prototype.forEach.call(elements, function(element) {
element.className = "html-color-fill";
//or remove class with:
//element.className = "";
});
classList.add()
, .remove()
и .toggle()
- это решение в современных браузерах, вопрос в том, как получить элемент html
.
Чтобы добавить класс к элементу:
var d = document.getElementById("someId");
d.className = d.className + " someclass ";
Чтобы удалить класс из элемента:
var d = document.getElementById("someId");
d.className = d.className.replace(" someclass ", " ");