Question

我正在尝试在元素上添加/删除类.active，但是它无法正常工作，我也不知道哪里出了问题

<div class="test">aa</div>

  <style>
     .active {
        background-color: #000;
     }
  </style>

  <script>

  var nico = document.getElementsByClassName('test');

  for (i=0; i<nico.length; i++) {
     nico[i].onclick = function() {

        this.classList.add('active');

        if(this.classList.contains('active')) {
           this.classList.remove('active');
        }
     }
  }

  </script>

感谢您的帮助

Answer 1

在您的 onclick 回调中，您始终首先运行：

"[{\"name\":\"john\","email\":\"john@somewhere.com\"},{\"name\":\"jane\",\"email\":\"jane@somewhere.com\"}]"

在实际检查元素是否包含类之前

    this.classList.add('active');

您应该创建一些切换逻辑，例如：

    if(this.classList.contains('active')) {
       this.classList.remove('active');
    }

并删除第一个if(this.classList.contains('active')) { this.classList.remove('active'); } else { this.classList.add('active'); }句子

希望这会有所帮助

在Javascript中使用getElementsByClassName从元素中添加/删除类

1 个答案: