使用css而不是jquery切换类

7ivaypg9 于 2023-06-25 发布在 jQuery

关注(0)|答案(2)|浏览(100)

是不是可以切换一个只有css的类？
假设我有以下内容：

<div class="parent">
   <div class="child collapsed">
        Boring Text
   </div>
</div>

有没有可能，只是使用css，当你点击parent时，你可以将collapsed类切换到expanded，反之亦然？

2条答案

是不是可以切换一个只有css的类？
没有
你可以通过使用伪类来处理状态，比如:hover、:active、:checked和:target，但是这和改变DOM中类属性的状态是不一样的。

.caret {
  transition: 0.5s;
}
.caret:not(.collapsed){
  transform: rotate(180deg);
}
.caret:is(.collapsed) {
  transform: rotate(0deg);
}