动态更改按钮样式

var button = document.getElementById("myButton");
button.addEventListener("mouseover", function() {
  button.style.backgroundColor = "red";
});
button.addEventListener("mouseout", function() {
  button.style.backgroundColor = "blue";
});

<style>
  .normal {
    background-color: blue;
  }
  .hover {
    background-color: red;
  }
</style>

<button id="myButton" class="normal">按钮</button>

<script>
  var button = document.getElementById("myButton");
  button.addEventListener("mouseover", function() {
    button.classList.remove("normal");
    button.classList.add("hover");
  });
  button.addEventListener("mouseout", function() {
    button.classList.remove("hover");
    button.classList.add("normal");
  });
</script>