Question

我有以下HTML结构，（这不能改变）。

<!-- Comment 1 -->
<div class="ac_feed_item comments_v2_list" style="padding-left: 0px;"></div> <!-- Main Div -->
<div class="ac_feed_item comments_v2_list reply" style="padding-left: 20px;"></div> <!-- Reply Div -->
<div class="ac_feed_item comments_v2_list reply" style="padding-left: 40px;"></div> <!-- Reply Div -->
<div class="ac_feed_item comments_v2_list reply" style="padding-left: 60px;"></div> <!-- Reply Div -->

<!-- Comment 2 -->
<div class="ac_feed_item comments_v2_list" style="padding-left: 0px;"></div> <!-- Main Div -->
<div class="ac_feed_item comments_v2_list reply" style="padding-left: 20px;"></div> <!-- Reply Div -->
<div class="ac_feed_item comments_v2_list reply" style="padding-left: 40px;"></div> <!-- Reply Div -->

<!-- Comment 3 -->
<div class="ac_feed_item comments_v2_list" style="padding-left: 0px;"></div> <!-- Main Div -->
<div class="ac_feed_item comments_v2_list reply" style="padding-left: 20px;"></div> <!-- Reply Div -->

我想删除（通过jQuery / Javascript），<div> Comment 2＆amp;所有的“回复”div（它没有父子关系，每个div本身，所以我不能使用.children来遍历DOM。）

但<div> Comment 3应保留<div> Comment 1。

所以基本上，我想删除comment 2及其所有.reply（ 不是孩子 ，他们是个人的div ）。

我在考虑使用.next()和if()＆amp; .hasClass()看看我们是否在我们要删除的评论部分的末尾，但是遇到了这个问题。

Answer 1

使用.nextUntil()方法，JQuery变得非常简单。 Documentation here.

此示例包含在此JSFiddle。

中

代码如下：

// On click of a div which is not of class .reply
$('div.ac_feed_item.comments_v2_list:not(.reply)').click(function() {
    // Remove all divs after this, until a div that does not have `.reply` class
    $(this).nextUntil('div.ac_feed_item.comments_v2_list:not(.reply)').remove();
    // remove the main comment div
    $(this).remove();
});

使用类删除所有元素，直到到达下一个元素

1 个答案: