Question

我想删除所有intro类下的所有名为test1的子类。到目前为止，我已经做到了，但是没有用。

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
  $("button").click(function(){
    $("p.intro").find("div.test1").removeClass("test1");
  });
});
</script>

</head>
<body>


<p class="intro"><div class="test1">This is a paragraph test1.</div></p>
<button>Remove the "test1" class from intro class</button>

</body>
</html>

Answer 1

检查此。您需要将<p>更改为<div>

https://jsfiddle.net/gnanavelr/dqbwjzeu/2/

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
  $("button").click(function(){
    $(".intro").find(".test1").removeClass("test1");
  });
});
</script>

</head>
<body>


<div class="intro"><div class="test1">This is a paragraph test1.</div></div>
<button>Remove the "test1" class from intro class</button>

</body>
</html>

Answer 2

您可以更改一些内容：

您不能在div标记中嵌套p。而是将p标签嵌套在div中。
虽然不需要使用.find()，但您可以将选择器更改为"div.intro p.test1"，以获取嵌套了p类的所有test1标签在div中，类别为intro

请参见下面的工作示例：

$(document).ready(function(){
  $("button").click(function(){
    $("div.intro p.test1").removeClass("test1");
  });
});

.test1 {
  color: red;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div class="intro">
  <p class="test1">This is a paragraph test1.</p>
  <p class="test1">This is a paragraph test2.</p>
</div>
<button>Remove the "test1" class from intro class</button>

Answer 3

将MockedProvider更改为p。

div

Answer 4

更正了一个小错误之后，将p更改为div，您可以执行以下操作。

这应该有效：

$(".intro > .test1").removeClass("test1");

如何在jQuery中使用父类删除子类？

4 个答案: