10

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 属性を削除し、それを 1 つに割り当てることです。

removeClass removeAttribute などを試しましたが、何も機能していないようです。jQueryではなくプレーンなJavascriptを使いたい

たとえば、ゲーム ページの JS コードは、アクティブなクラスを MyText ページから削除し、それをゲーム ページの li 要素に追加します。

4

3 に答える 3

26

一度にアクティブになるのは 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";
于 2013-04-22T19:02:29.467 に答える