时间戳

首页 > 解决方案 > 用js选择标签

javascript - 用js选择标签

问题描述

如何使用 js 制作选择元素？想象一下：

<button class="" type="button" role="option"> Tag1 + </button>
<button class="" type="button" role="option"> Tag2 + </button>

当我单击其中一个按钮时，它会收到如下活动类：

<button class="active" type="button" role="option"> Tag1 + </button>
<button class="" type="button" role="option"> Tag2 + </button>

有什么帮助吗？大家干杯！

标签： javascripthtmlcss

解决方案

我认为您需要如下代码：

CSS：

<style type="text/css">
        .active { 
            color: white;
            background-color: black;
        }
</style>

网页：

<button class="" type="button" id="tag1" onclick="addClass()" role="option">Tag1 </button>

JS：

<script type="text/javascript">
    function addClass() { 
       var tag1 = document.getElementById("tag1");
          
          if (tag1.classList.contains("active")) {
             tag1.classList.remove("active");
          } else {
             tag1.classList.add("active");
          }
    }
</script>

推荐阅读