使用pure javascript从特定div中删除所有.col-md类

问题描述：

我试图从特定div中的所有子元素中删除所有.col-md-1类。使用pure javascript从特定div中删除所有.col-md类

<div id="question123"> 
 
    <div class="panel-title"> 
 
    .... 
 
    </div> 
 
    
 
    <div class="panel-body"> 
 
    <div class="answer clearfix"> 
 
     <h3> ... </h3> 
 
     <div class="answer clearfix"> 
 
     <ul class"question-list"> 
 
      <div class="row"> 
 
      <div class = "col-md-1"> 
 
       <li class="question-item" id="javatbd74656737"> 
 
       <div class="checkbox">...</div> 
 
       </li> 
 
      </div> 
 
      <div class = "col-md-1"> 
 
       <li class="question-item" id="javatbd74656737"> 
 
       <div class="checkbox">...</div> 
 
       </li> 
 
      </div> 
 
      <div class = "col-md-1"> 
 
       <li class="question-item" id="javatbd74656737"> 
 
       <div class="checkbox">...</div> 
 
       </li> 
 
      </div> 
 
      </div> 
 
     </ul> 
 
     </div> 
 
    </div> 
 
    </div> 
 
</div>

我现在它的深度嵌套，但是这是我从一个动态生成的html了。我必须以某种方式访问这个特定的问题div。并从所有子div中删除.col-md-1。

感谢您的帮助！

其中 “特别股利”？你试过什么了？ – evolutionxbox

请注意，您需要在ul中实际使用li - 只是在ul内部有一堆div不符合语义上的正确性。 – gavgrif

答

您可以使用find（）和removeClass方法。

$('#parentElement').find('.col-md-1').removeClass('col-md-1');

'removeClass'不需要类选择器，所以可以更改为'removeClass（'col-md-1'）' –

哦，当然了！ – Strernd

答

你可以使用jQuery removeClass()功能的..

$('.question-list .col-md-1').removeClass('col-md-1');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="question123"> 
 
     <div class="panel-title"> 
 
     .... 
 
     </div> 
 
     
 
     <div class="panel-body"> 
 
     <div class="answer clearfix"> 
 
      <h3> ... </h3> 
 
      <div class="answer clearfix"> 
 
      <ul class"question-list"> 
 
       <div class="row"> 
 
       <div class = "col-md-1"> 
 
        .... 
 
       </div> 
 
       <div class = "col-md-1"> 
 
        .... 
 
       </div> 
 
       <div class = "col-md-1"> 
 
        .... 
 
       </div> 
 
       </div> 
 
      </ul> 
 
      </div> 
 
     </div> 
 
     </div> 
 
    </div>

答

对于非jQuery的方法 - 你可以得到所有的div用querySelectorAll，然后将该类删除课程。

var elements= document.querySelectorAll('.question-list .col-md-1'); 
elements.forEach(function(el){ 
    el.classList.remove('col-md-1'); 
})

答

让您#question123和你.question-list内的所有元素，并使用removeClass去除类

$('#question123 .question-list .col-md-1').removeClass('col-md-1');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="question123"> 
 
    <div class="panel-title"> 
 
    .... 
 
    </div> 
 
    
 
    <div class="panel-body"> 
 
    <div class="answer clearfix"> 
 
     <h3> ... </h3> 
 
     <div class="answer clearfix"> 
 
     <ul class="question-list"> 
 
      <div class="row"> 
 
      <div class = "col-md-1"> 
 
       .... 
 
      </div> 
 
      <div class = "col-md-1"> 
 
       .... 
 
      </div> 
 
      <div class = "col-md-1"> 
 
       .... 
 
      </div> 
 
      </div> 
 
     </ul> 
 
     </div> 
 
    </div> 
 
    </div> 
 
</div>

使用pure javascript从特定div中删除所有.col-md类

相关推荐