如何动态地向元素添加新类?

its*_*sme 25 css addclass

有没有办法在元素上添加新的CSS类:hover

喜欢jQuery,但翻译成CSS:

$(element).addClass('someclass');
Run Code Online (Sandbox Code Playgroud)

Ren*_*och 28

简短的回答没有:)

但你可以像悬停一样使用相同的CSS:

a:hover, .hoverclass {
    background:red;
}
Run Code Online (Sandbox Code Playgroud)

也许如果你解释为什么你需要添加这个类,可能有更好的解决方案?


Nat*_*ate 19

既然每个人都给了你jQuery/JS的答案,我会提供一个额外的解决方案.您的问题的答案仍然是否定,但使用LESS(CSS预处理器)您可以轻松完成此操作.

.first-class {
  background-color: yellow;
}
.second-class:hover {
  .first-class;
}
Run Code Online (Sandbox Code Playgroud)

很简单,只要你将鼠标悬停在.second-class它上面就可以获得它的所有属性.first-class.请注意,它不会永久添加类,只是在悬停时.您可以在此处了解更多关于LESS的信息:LESS 入门

这是一种SASS方式:

.first-class {
  background-color: yellow;
}
.second-class {
  &:hover {
    @extend .first-class;
  }
}
Run Code Online (Sandbox Code Playgroud)


Flu*_*yte 6

CSS真的没有能力以与JavaScript相同的方式修改对象,所以简而言之 - 没有.