2017-06-01 51 views
0

我试图从特定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。

感谢您的帮助!

+0

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

+0

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

回答

0

您可以使用find()和removeClass方法。

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

'removeClass'不需要类选择器,所以可以更改为'removeClass('col-md-1')' –

+0

哦,当然了! – Strernd

0

你可以使用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>

0

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

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

让您#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>