If statement JS开关仅在两种颜色之间单击，否则

我正在处理我的公文包，需要在元素的样式和状态之间切换。目前，我正试图在下面的示例中使用它。在这种情况下，我的目标是单击按钮，并在每次单击时在绿色和红色背景之间切换。但有些事情是行不通的。我可以从绿色切换到红色，但不能从红色切换到绿色。我错过了什么

<button id="button">Toggle</button>
<div class="test" id="test"></div>


.test {
  width: 100px;
  height: 100px;
  background: green;
  margin-top: 20px;
}


var btn = document.getElementById("button");
var test = document.getElementById("test");

btn.onclick = function() {
  if (test.style.background = "green") {test.style.background = "red";} else {test.style.background = "green";}};

切换
.测试{
宽度：100px；
高度：100px；
背景：绿色；
边缘顶部：20px；
}
var btn=document.getElementById（“按钮”）；
var测试=document.getElementById（“测试”）；
btn.onclick=函数（）{
if（test.style.background=“green”）{test.style.background=“red”}else{test.style.background=“green”；}；

代码笔演示

---

非常感谢

在if条件下，应该有双（=）等号，并且还可以通过

backgroundColor

而不是

background

进行检查，因为某些浏览器具有更多

background

属性，如

background:green无重复滚动0%0%因此条件将不会执行。

我建议使用
backgroundColor
而不是
background


var btn=document.getElementById（“按钮”）；
var测试=document.getElementById（“测试”）；
btn.onclick=函数（）{
如果（test.style.backgroundColor==“红色”）{
test.style.backgroundColor=“绿色”；}
否则{
test.style.backgroundColor=“红色”；
}
}
.test{
宽度：100px；
高度：100px；
背景：绿色；
边缘顶部：20px；
}
切换
非常感谢！这就是我一直在寻找的解决方案！