置き換えるクラス名はjqueryの

Question

に動作していない私は、HTMLのセグメント

for (i = 0; i < 3; i++) { 
 
     if ($("div.mm-panels").children()[i].getAttribute("id") == "m2") { 
 
      var a = $("div.mm-panels").children()[i].getAttribute("class"); 
 
      console.log(a); 
 
      var f = a.replace(a, "mm-panel mm-hasnavbar mm-opened"); 
 
      alert("class name chnge to : " + f); 
 

 
     } 
 
    }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="mm-panels"> 
 
     <div class="mm-panel mm-hidden mm-hasnavbar" id="m0"></div> 
 
     <div class="mm-panel mm-hasnavbar mm-opened" id="m1"></div> 
 
     <div class="mm-panel mm-hidden mm-hasnavbar" id="m2"></div> 
 
    </div>

を持っていると私は、ID =「M2」を持っているMM-パネルの子を見つけて、クラスを交換したいです「mm-panel mm-hasnavbar mm-opened」という名前のクラス名と、他の子クラス名は「mm-panel mm-hidden mm-hasnavbar」でクラス名を置き換えます。

ただし、置き換えられません。どうすればいい？

Answer 1

replaceは、文字列 "a"を置き換えて新しい文字列 "f"に保存するだけです。あなたは、クラスを削除するには、クラスや.removeClass()を追加するために.addClass()を使用することができますjQueryのタグを使用されるように$("div.mm-panels").children()[i].setAttribute("class",f)

for (i = 0; i < 3; i++) { 
 
     if ($("div.mm-panels").children()[i].getAttribute("id") == "m2") { 
 
      var a = $("div.mm-panels").children()[i].getAttribute("class"); 
 
      var f = a.replace(a, "mm-panel mm-hasnavbar mm-opened"); 
 
      $("div.mm-panels").children()[i].setAttribute("class",f) 
 
     } else { 
 
      var a = $("div.mm-panels").children()[i].getAttribute("class"); 
 
      var f = a.replace(a, "mm-panel mm-hidden mm-hasnavbar"); 
 
      $("div.mm-panels").children()[i].setAttribute("class",f) 
 
     } 
 
     
 
     
 
     $("div.mm-panels").children()[i].innerText = $("div.mm-panels").children()[i].getAttribute("class") 
 
    }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="mm-panels"> 
 
     <div class="mm-panel mm-hidden mm-hasnavbar" id="m0"></div> 
 
     <div class="mm-panel mm-hasnavbar mm-opened" id="m1"></div> 
 
     <div class="mm-panel mm-hidden mm-hasnavbar" id="m2"></div> 
 
    </div>

Answer 2

を使用する要素のクラスを設定するには

。

$("div.mm-panels").find(":not(div#md2)").removeClass("mm-panel mm-hasnavbar mm-opened").addClass("mm-panel mm-hidden mm-hasnavbar"); 
 
$("div.mm-panels").find("div#m2").removeClass("mm-panel mm-hidden mm-hasnavbar").addClass("mm-panel mm-hasnavbar mm-opened");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="mm-panels"> 
 
    <div class="mm-panel mm-hidden mm-hasnavbar" id="m0">m0</div> 
 
    <div class="mm-panel mm-hasnavbar mm-opened" id="m1">m1</div> 
 
    <div class="mm-panel mm-hidden mm-hasnavbar" id="m2">m2</div> 
 
</div>