javascript - 如何为所有：悬停样式添加悬停类

Question

我希望能够添加hover到classList元素以强制触发悬停样式。

在 JS 中，如何检测所有:hover样式并添加一个hover具有相同样式的类？

例如，如果类是：

a:hover {
}

我想补充：

a:hover, a.hover {
}

我想编写一个 JS 脚本来进行我上面提到的转换，a.hover为 ALL 添加类样式:hover。我怎样才能做到这一点？

注意：我无权访问 CSS。它是从外部加载的，所以我不能只添加它。这就是为什么我想制作一个在开始时运行的脚本来执行此操作。

标签： javascripthtmlcss

Answer 1

如评论中所述，您可以使用 sass/scss mixins

SCSS

@mixin addHover {
  &.hover {
    background-color: red;
  }
  &:hover {
    background-color: red;
  }
}

div {
  width: 100px;
  height: 100px;
  @include addHover;
}

---

HTML

<div class="hover"></div>
<div class=""></div>
<div class=""></div>
<div class=""></div>
<div class=""></div>