如何在悬停时撤消javascript样式？

Question

我已将某些文本块变成红色。我需要将它们悬停改回黑色。

我的代码如下所示：CSS

span:hover {
  cursor: pointer;
  color:black;
}

document.addEventListener("DOMContentLoaded", function(event) {
  for (var i = 0; i < document.querySelectorAll("span").length; i++) {
    var hiddenProbability = Math.floor(Math.random() * 100) + 1;
    if (hiddenProbability <= 50) {
      document.querySelectorAll("span")[i].style.color = "red";
    }
  }
});

<span>Hello. My name is Tom </span>
<span>And I like to play video games </span>
<span>But I am too old to be goofing around </span>

如何在悬停时将颜色更改回黑色？我尝试使用CSS（颜色：黑色），但没有生效。

Answer 1

您的JavaScript是否正在运行？如果我对问题的理解正确，听起来您只是在添加一个事件监听器，该事件监听器在页面内容首次加载时发生（取决于您的脚本在html中的位置，它可能会触发也可能不会触发）。] >

如果您希望他们对鼠标事件做出反应，则需要根据实际需要使用onmouseover（或onmouseenter）。

https://www.w3schools.com/jsref/event_onmouseover.asp

如果只是在页面首次加载时发生，那么您可能只需要修改事件侦听器。Code inside DOMContentLoaded event not working