为什么我无法恢复 div 元素的颜色？

【问题标题】：Why am I not able to revive the colour of my div element?为什么我无法恢复 div 元素的颜色？
【发布时间】：2020-06-10 18:59:16
【问题描述】：

我想在鼠标离开时恢复以前的颜色。但似乎样式属性不接受十六进制颜色值，实际上甚至不接受普通的硬编码？我该如何克服这个问题。

function update(element){
document.getElementById('zone').style.backgroundImage= "url(" +element.src+ ")";
document.getElementById('zone').innerHTML= element.alt;
}

function undo(){
document.getElementById('zone').style.backgroundColor= "grey";
document.getElementById('zone').innerHTML= "Hover Over";
}

更新函数在 onmouseover() 期间执行，撤消在 onmouseout() 期间执行。

【问题讨论】：

鼠标移出时您似乎没有将 backgroundImage 设置为 none。

标签： javascript html css onmouseover onmouseout

【解决方案1】：

如上所述，您需要取消设置背景图片 document.getElementById('zone').style.backgroundImage= "unset";。在你的函数中它看起来像这样

function undo(){
document.getElementById('zone').style.backgroundImage= "unset";
document.getElementById('zone').style.backgroundColor= "grey";
document.getElementById('zone').innerHTML= "Hover Over";
}

另外，我建议使用onmouseenter 而不是onmouseover，因为如果您对html结构不小心，后者可能会在悬停元素时触发多次，这可能会导致更大的功能出现性能问题。

【讨论】：

非常感谢。我按照你的建议做了。它现在工作正常。谢谢。