javascript - 如何通过检查元素的子元素是否具有特定的类名来将 css 属性添加到元素的伪类

Question

<div class="header">
<span class= "text">
  <span class="icon disable">
  ::before
  </span>
<span>
  ::after
</div>

我想通过检查其子跨度是否具有类名“禁用”，将 css 属性 background:transparent 添加到具有类名“文本”的跨度伪类::after。

请查看图片以了解我的要求，以便给我任何解决方案。可以用 css 实现吗？

我试了好几个小时..请帮帮我! 提前致谢.......... described in image

Answer 1

没那么简单。但是您可以简单地使用 jQuery hasClass() 方法来完成。

HTML

<div class="header">
  <span class= "text">
    <span class="icon disable">
      Hai
    </span>
  <span>
</div>

JQuery

if($('.icon').hasClass('disable')) {
  $('.text').addClass('disableChild')
}

CSS

.disableChild {
  background-color: red;
}

检查此链接 codepen用于工作模型。