我正在尝试使用javascript和CSS将日历上每一天的background属性在蓝色和绿色之间进行更改。比如切换功能。默认的颜色是蓝色，我已经设法使每一天都变成绿色，当点击，但我不知道如何改变他们回到蓝色。
这是我试过的。
null
const days = document.getElementsByClassName('day')
for (let i = 0; i < days.length; i++) {
days[i].addEventListener('click', function(e) {
if (e.target.style.background != 'linear-gradient(#7ce8b6, #00ff2a)') {
e.target.style.background = 'linear-gradient(#7ce8b6, #00ff2a)'
} else if (e.target.background != 'linear-gradient(#7CB9E8, #00FFFF)') {
e.target.background = 'linear-gradient(#7CB9E8, #00FFFF)'
}
});
}.day {
height: 10em;
width: 100px;
padding: 1em;
border: 5px solid rgb(29, 29, 116);
border-radius: 1em;
background: linear-gradient(#7CB9E8, #00FFFF);
}<div class="day">1</div>
<div class="day">2</div>
<div class="day">3</div>
<div class="day">4</div>
<div class="day">5</div>
<div class="day">6</div>
<div class="day">7</div>
<div class="day">8</div>
<div class="day">9</div>
<div class="day">10</div>null
定义一个具有绿色背景颜色样式的CSS类，使用javascript，只需在每个div元素上切换该类。
null
const days = document.getElementsByClassName('day');
for (let i = 0; i < days.length; i++) {
days[i].addEventListener('click', function(e) {
days[i].classList.toggle("green");
});
}.day {
height: 30px;
width: 30px;
padding: 1em;
border: 5px solid rgb(29, 29, 116);
border-radius: 1em;
background: linear-gradient(#7CB9E8, #00FFFF);
}
.green {
background: linear-gradient(#7ce8b6, #00ff2a);
}<div class="day">1</div>
<div class="day">2</div>
} else if (e.target.background != 'linear-gradient(#7CB9E8, #00FFFF)') {
e.target.background = 'linear-gradient(#7CB9E8, #00FFFF)'
}
可能需要更改为：
} else if (e.target.style.background != 'linear-gradient(#7CB9E8, #00FFFF)') {
e.target.style.background = 'linear-gradient(#7CB9E8, #00FFFF)'
}
以便它与第一个if语句相同。我还没有能够模拟代码，但是，只要从逻辑上通读它，我就发现了这个可能的错误。
编辑：
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<style>
.day {
height: 10em;
width: 100px;
padding: 1em;
border: 5px solid rgb(29, 29, 116);
border-radius: 1em;
background: linear-gradient(#7CB9E8, #00FFFF);
}
</style>
<div class="day">1</div>
<div class="day">2</div>
<div class="day">3</div>
<div class="day">4</div>
<div class="day">5</div>
<div class="day">6</div>
<div class="day">7</div>
<div class="day">8</div>
<div class="day">9</div>
<div class="day">10</div>
<script>
const days = document.getElementsByClassName('day')
for (let i = 0; i < days.length; i++) {
days[i].addEventListener('click', function(e) {
alert(e.target.style.background);
if (e.target.style.background != 'linear-gradient(rgb(124, 232, 182), rgb(0, 255, 42))') {
e.target.style.background = 'linear-gradient(#7CE8B6, #00FF2A)';
} else {
e.target.style.background = 'linear-gradient(#7CB9E8, #00FFFF)';
}
});
}
</script>
</body>
</html>
在测试时，我的浏览器检测到的颜色为RGB，因此，通过将十六进制值更改为RGB范围，它现在会变回来
