通过 JavaScript classList 为 div 添加样式

Question

我的问题可能听起来很愚蠢，因为我是 javascript 新手。我有以下一段纯 JavaScript 代码。我想要实现的是在单击按钮时更改按钮的背景颜色。我正在尝试使用普通的 javascript 来实现这一点。没有 jquery 或任何其他框架。

JS

var save = document.querySelector('.wrapper .content button');
save.addEventListener('click', function () {    
    save.classList.style.background-color = 'red';
});

Answer 1

你必须这样做

var save = document.querySelector('.wrapper .content button');
save.addEventListener('click', function () {    
    save.style['background-color'] = 'red';
});

您也可以通过background-color这种方式访问样式的属性

save.style.backgroundColor = 'red';

用CSS属性-像（背景颜色）以驼峰在Javascript（表示的backgroundColor）对象。

片段

var save = document.querySelector('.wrapper .content button');
save.addEventListener('click', function () {    
    save.style['background-color'] = 'red';
});

save.style.backgroundColor = 'red';

var save = document.querySelector('.con');
save.addEventListener('click', function () {    
    save.style['background-color'] = 'yellow';
    //or  save.style.backgroundColor = 'yellow';
});