javascript - 结合内联css和悬停状态，可能吗？

Question

我发现，如果我们编写内联 css(或使用 JavaScript 添加它)，那么我们将失去 css hover 的值(value)。是否有可能改变这种行为？

简单示例

---

<div id="test" style="color: red">test</div>
<style>
#test:hover {
    color:blue;
}
</style>

在这种情况下悬停不起作用。

更新

我不能使用 !important，因为在它之后我将无法通过 JavaScript 更改该属性。

此外，我动态生成样式，因此无法通过 JavaScript 添加特定类。

Answer 1

因为内联 css 覆盖了文件中的 css 样式 如果你有

color: blue !important

它会工作但不推荐，你总是可以使用 jquery 来删除内联样式标签，哈哈

更新:

使用 jquery 或使用 javascript 删除样式标签...添加 !important 以便内联 css 具有重要意义