如何为 div 元素的所有 children 删除带有 jQuery 的 class 名称？

Question

我搜索了一些代码，关于如何从树形菜单中删除 class 名称，以这种方式停止树形菜单类型，并且可以使用普通的 div 框。换句话说，我的 jQuery 代码自己添加了一个 class，我想从某个 div 中删除它，并从那个 div 的所有 children 中删除它] ( children, grand-children, grand grand-children 等等...)。

（我从 youtube 上的教程中获取 html、css 和 jQuery 代码 :D ）

我的html代码是这样的:

<div class="meniuArbore">
<div><p>Bucharest</p>
    <div>Place 1
        <div class="prezentare">   // from this on (inclusive), to don't have the tree menu style
            <div class="prezentareBox1">
            </div>
            <div class="prezentareBox2">
            </div>
        </div>
    </div>
</div>

我的 CSS 风格是这样的：

.prezentare {
    width: 153mm;
    height: 40mm;
    border: 0.5mm solid #000;
}

.meniuArbore {
    padding-top: 10px;

}

.meniuArbore div {
padding-left: 20px;

}

.meniuArbore .parinte div {
display: none;
cursor: default;
}

.meniuArbore .parinte {
cursor:pointer;
background:transparent url(http://www3.telus.net/jianlu58/plus.gif) no-repeat left 1.1mm;
}

.meniuArbore .extins {
background:transparent url(http://www3.telus.net/jianlu58/minus.gif)no-repeat left 0.2mm;
}

和 jQuery 代码：

/* Meniu tree */
$(function() {
$('.meniuArbore div:has(div)').addClass('parinte');

// I added here the code from bellow, that I came up with ...
$('.meniuArbore div').click(function() {
var thistree = $(this);
thistree.children('div').toggle();
thistree.filter('.parinte').toggleClass('extins');
return false;
});
});

我认为它应该删除 class "prezentare" 下面的 class "parinte" 的代码是这样的：

$('div:hasClass(prezentare)').removeClass('parent');
$('div:hasClass(prezentare)').find('*').removeClass('parent');

请多多指教！我是 jQuery 的新手，但我觉得我已经很接近了。 :D

Answer 1

您需要做的就是在要从子项中删除的类名之前，在选择器中使用父项名称：

假设您有一个带有 ID 容器的父代，其子代的类名是 "classYouWantToRemove"。你会这样吗

$("#container .classYouWantToRemove").removeClass("classYouWantToRemove")

查看工作片段以查看 html 和内联 JQuery 工作。

#container .classYouWantToRemove {
 border: solid 1px red;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="container">
<div class="classYouWantToRemove">Hey</div>
<div class="classYouWantToRemove">Hey</div>
<div class="classYouWantToRemove">Hey</div>
<div class="classYouWantToRemove">Hey</div>
<div class="classYouWantToRemove">Hey</div>
<div class="classYouWantToRemove">Hey</div>
<div class="classYouWantToRemove">Hey</div><div class="classYouWantToRemove">Hey</div>
<div class="classYouWantToRemove">Hey</div>
<div class="classYouWantToRemove">Hey</div>
</div>
<button id="removeAll" onclick='$("#container .classYouWantToRemove").removeClass("classYouWantToRemove")'>Remove classes</button>

如何为 div 元素的所有 children 删除带有 jQuery 的 class 名称？

How to remove a class name with jQuery for all children of a div element?

tree

jquery

children