Допустим, нам надо добавлять/убирать один какой-то класс к элементу не трогая другие классы, но, при этом, наши классы могут быть разными (с префиксом). В данном примере, каждый класс будет заменять друг друга у body
при клике на элемент с классом .color
. У элементов с классом .color
должны быть айдишники, которые мы будем добавлять body
в виде классов!
window.addEventListener("load", function() {
function checkClass(el) {
let reg = /(color-(.*))/i
return el.className.match(reg);
}
let colors = document.querySelectorAll(".color");
for(let i = 0; i < colors.length; i++) {
colors[i].onclick = function(){
let colorId = this.getAttribute("id");
let body = document.querySelector("body");
let needColor = checkClass(body);
if(needColor != null) {
let remCol = needColor[0];
body.classList.remove(remCol);
body.classList.add(colorId);
}
}
}
});