我有以下 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
&它的所有“回复”div(它没有父子关系,每个div都是独立的,所以我无法使用.children
来遍历DOM)。
但是<div> Comment 3
应该保留,就像 <div> Comment 1
一样.
基本上,我想删除 comment 2
及其所有 .reply
(不是子元素,它们是单独的 div)。
我正在考虑使用类似 .next()
的东西与 if()
& .hasClass()
看看我们是否在我们想要删除的评论部分的末尾,但遇到了麻烦。
最佳答案
JQuery 使用 .nextUntil()
方法使这一切变得非常简单。 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();
});
关于javascript - 删除具有某个类的所有元素,直到到达下一个元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9399986/