Javascript 为什么在div上添加mouseover效果？即使在mouseout之后，这种效果仍然存在？

我的意思是如何在鼠标离开时保留实际的上一个类

功能突出显示（x，y）{
var sel=document.getElementById（y）；
sel.style.borderBottom=“2px solid”+x；
sel.style.opacity=“1”；
sel.style.transition=“所有易用.1s”
}

---

即使鼠标移出，转换仍然保持不变。鼠标移出时，我需要旧的CSS类。

您实际上是在为元素设置样式“永久”：

sel.style.opacity=1

。 尝试向元素中添加一些css悬停逻辑，例如：

CSS:

.box {
  background-color: red;
}

.box:hover {
  background-color: green;
  cursor: pointer;
  -webkit-transition: background-color 2s ease-out;
  -moz-transition: background-color 2s ease-out;
  -o-transition: background-color 2s ease-out;
  transition: background-color 2s ease-out;
}

<div class='box'>Your element</div>

HTML:

.box {
  background-color: red;
}

.box:hover {
  background-color: green;
  cursor: pointer;
  -webkit-transition: background-color 2s ease-out;
  -moz-transition: background-color 2s ease-out;
  -o-transition: background-color 2s ease-out;
  transition: background-color 2s ease-out;
}

<div class='box'>Your element</div>

您的元素

在mouseover上调用函数并不意味着在mouseout上会出现相反的函数。要恢复以前的状态，只需在mouseover上创建它的临时副本，并将其设置回onMouseOut即可。