在Javascript中从Div中删除类

Question

我有一个div部分

<div class="1">
        <div id="tab1"">
            <ul class="nav nav-tabs">                   
                <li class="active ans-tab"> <a href="{$cdn2}">MyText</a></li>
                <li class="topTab"><a href="{$cdn2}/Game/">Game</a></li>
                <li class="topTab"><a href="{$cdn2}/lb/">LB</a></li>
            </ul>
        </div>
       <div id="tab2">
        <ul class="nav nav-pills">
            <li class="active"> <a href="{$cdn2}">Top</a></li>
            <li><a href="{$cdn2}/categories/">Categories</a></li>
        </ul>
    </div>
</div>

我在div中用作href的每个页面上尝试做的是从li项中删除class属性,将其作为活动状态并将其分配给一个,我点击.

我试过removeClass removeAttribute等但似乎没有什么对我有用.我想使用普通的Javascript没有jQuery

例如,我在游戏页面上的JS代码从MyText页面中删除活动类并将其添加到Game页面的li元素中.

Answer 1

我假设一次只有一个是活跃的.要删除,您可以这样做:

var active = document.querySelector(".active");

active.classList.remove("active");

然后添加,执行以下操作:

// Assuming `this` is your element
this.classList.add("active");

这两种都可以在现代浏览器中使用.对于较旧的浏览器,使用相同的DOM选择,然后对.className属性进行典型的字符串操作.

active.className = active.className.replace(/\bactive\b/, " ");

this.className += " active";