Javascript 为什么单击时我的颜色不变？

所以我有一个非常简单的代码，当我运行它时，它不会出错，但问题是，它没有做它应该做的事情

当我点击中间的div时，它应该改变颜色…

我错过了什么？似乎找不到任何打字错误

var panel=document.getElementById（'color_panel'）；
document.getElementById（'color_panel'）。addEventListener（“单击”，函数（）{
var mySwitch=document.getElementById（'color_panel'）.style.background；
如果（mySwitch==“#76FF03”）{
document.getElementById（'color_panel'）.style.background=“#039BE5”；
}否则{
document.getElementById（'color_panel'）.style.background=“#76FF03”；
}
});

点击我
还是双击？
添加过渡您需要进行一些基本调试。添加一个
console.log
语句，检查您在
if
语句中输入的值，并查看它的实际值

浏览器正在将其正常化，因此
mySwitch==“#76FF03”
永远不会为真


var panel=document.getElementById（'color_panel'）；
document.getElementById（'color_panel'）。addEventListener（“单击”，函数（）{
var mySwitch=document.getElementById（'color_panel'）.style.background；
console.log（mySwitch）；
如果（mySwitch==“#76FF03”）{
document.getElementById（'color_panel'）.style.background=“#039BE5”；
}否则{
document.getElementById（'color_panel'）.style.background=“#76FF03”；
}
});

点击我
还是双击？
添加过渡您需要进行一些基本调试。添加一个
console.log
语句，检查您在
if
语句中输入的值，并查看它的实际值

浏览器正在将其正常化，因此
mySwitch==“#76FF03”
永远不会为真


var panel=document.getElementById（'color_panel'）；
document.getElementById（'color_panel'）。addEventListener（“单击”，函数（）{
var mySwitch=document.getElementById（'color_panel'）.style.background；
console.log（mySwitch）；
如果（mySwitch==“#76FF03”）{
document.getElementById（'color_panel'）.style.background=“#039BE5”；
}否则{
document.getElementById（'color_panel'）.style.background=“#76FF03”；
}
});

点击我
还是双击？
添加过渡您的代码似乎是正确的，您在变量
mySwitch
中得到了
rgb（118255,3）
，因此它不会进入if条件

你的代码应该是

<script type="text/javascript">
    var panel = document.getElementById('color_panel');
    document.getElementById('color_panel').addEventListener("click", function() {
      var mySwitch = document.getElementById('color_panel').style.background;alert(mySwitch);
      if (mySwitch == "rgb(118, 255, 3)") {
        document.getElementById('color_panel').style.background = "#039BE5";
      } else {
        document.getElementById('color_panel').style.background = "#76FF03";
      }
    });
</script>


var panel=document.getElementById（'color_panel'）；
document.getElementById（'color_panel'）。addEventListener（“单击”，函数（）{
var mySwitch=document.getElementById（'color_panel'）.style.background；alert（mySwitch）；
如果（mySwitch==“rgb（118255,3）”）{
document.getElementById（'color_panel'）.style.background=“#039BE5”；
}否则{
document.getElementById（'color_panel'）.style.background=“#76FF03”；
}
});
您的代码似乎是正确的，您在变量
mySwitch
中得到了
rgb（118255,3）
，因此它不会进入if条件

你的代码应该是

<script type="text/javascript">
    var panel = document.getElementById('color_panel');
    document.getElementById('color_panel').addEventListener("click", function() {
      var mySwitch = document.getElementById('color_panel').style.background;alert(mySwitch);
      if (mySwitch == "rgb(118, 255, 3)") {
        document.getElementById('color_panel').style.background = "#039BE5";
      } else {
        document.getElementById('color_panel').style.background = "#76FF03";
      }
    });
</script>


var panel=document.getElementById（'color_panel'）；
document.getElementById（'color_panel'）。addEventListener（“单击”，函数（）{
var mySwitch=document.getElementById（'color_panel'）.style.background；alert（mySwitch）；
如果（mySwitch==“rgb（118255,3）”）{
document.getElementById（'color_panel'）.style.background=“#039BE5”；
}否则{
document.getElementById（'color_panel'）.style.background=“#76FF03”；
}
});
mySwitch
将以rgb显示颜色，您无法与stirng进行比较。删除内联样式并添加而不是使用类。然后使用
toggle
在每次单击时切换类


var panel=document.getElementById（'color_panel'）；
document.getElementById（'color_panel'）。addEventListener（“单击”，函数（）{
panel.classList.toggle（'changeColor'）
});
.divStyle{
背景:#76FF03；
保证金：自动；
字体系列：世纪哥特式；
字体大小：40px；
颜色：#37474F；
宽度：200px；
高度：200px；
填充：20px；
利润率最高：50%；
转化：translateY（-50%）；
文本对齐：居中；
}
.换颜色{
背景：#039BE5
}

点击我
还是双击？
添加过渡！
mySwitch
将以rgb显示颜色，您无法与stirng进行比较。删除内联样式并添加而不是使用类。然后使用
toggle
在每次单击时切换类


var panel=document.getElementById（'color_panel'）；
document.getElementById（'color_panel'）。addEventListener（“单击”，函数（）{
panel.classList.toggle（'changeColor'）
});
.divStyle{
背景:#76FF03；
保证金：自动；
字体系列：世纪哥特式；
字体大小：40px；
颜色：#37474F；
宽度：200px；
高度：200px；
填充：20px；
利润率最高：50%；
转化：translateY（-50%）；
文本对齐：居中；
}
.换颜色{
背景：#039BE5
}

点击我
还是双击？
添加过渡！
您的问题的正确答案是

在框中单击时，代码正在工作。你的代码没有错误，也没有任何打字错误

单击框时，背景颜色正在更改只需将背景颜色更改为原来的颜色：

在html文件的第一个div中：

style=“background:#76FF03；

在脚本中的else语句中：

document.getElementById（'color_panel'）.style.background=“#76FF03”
您的问题的正确答案是

当你在框中单击时，你的代码正在工作。你的代码没有错误，也没有任何打字错误

背景色为ch