当子 div 与父 div 是多个 w.r. 时删除子 div答案

【问题标题】：remove a child div when they are multiple w.r.to parent div当子 div 与父 div 是多个 w.r. 时删除子 div
【发布时间】：2018-05-23 13:26:12
【问题描述】：

我有两个像这样动态创建的 div：

<div id="starredDiv">
  <div class="list-group" id="starredList">
    <div class="list-group-item" style="border-left: none; border-right: none;">
      <img class="a-img" src="./img/desktop.png" height="25" width="25">
      <a class="a-file">message.txt</a>
      <button class="btn glyphicon glyphicon-ok btn-sm btn-current btn-default" style="float: right;"></button>
      <button class="btn glyphicon glyphicon-star btn-sm btn-star btn-primary" style="float: right;"></button>
    </div>
    <div class="list-group-item" style="border-left: none; border-right: none;">
      <img class="a-img" src="./img/desktop.png" height="25" width="25">
      <a class="a-file">testcase.txt</a>
      <button class="btn glyphicon glyphicon-ok btn-sm btn-current btn-default" style="float: right;"></button>
      <button class="btn glyphicon glyphicon-star btn-sm btn-star btn-primary" style="float: right;"></button>
    </div>
  </div>
</div>


<div id="recentDiv">
  <div class="list-group" id="recentList">
    <div class="list-group-item" style="border-left: none; border-right: none;">
      <img class="a-img" src="./img/desktop.png" height="25" width="25">
      <a class="a-file">message.txt</a>
      <button class="btn glyphicon glyphicon-ok btn-sm btn-current btn-default" style="float: right;"></button>
      <button class="btn glyphicon glyphicon-star btn-sm btn-star btn-primary" style="float: right;"></button>
    </div>
    <div class="list-group-item" style="border-left: none; border-right: none;">
      <img class="a-img" src="./img/desktop.png" height="25" width="25">
      <a class="a-file">testcase.txt</a>
      <button class="btn glyphicon glyphicon-ok btn-sm btn-current btn-default" style="float: right;"></button>
      <button class="btn glyphicon glyphicon-star btn-sm btn-star btn-primary" style="float: right;"></button>
    </div>
  </div>
</div>

当用户单击recentList 的glyphicon-star 按钮时，我想删除出现在starredList 中的list-group-item w.r.to <a>。为此，我写了一些类似的东西：

var file = $(this).closest('.list-group-item').children('.a-file').text();

  if($(#starredList).children('.list-group-item').children('.a-file').text() == file){
    $(#starredList).children('.list-group-item').remove();
  }

当 starredList 存在一个列表组项但不是多个时，这有效吗？

【问题讨论】：

标签： javascript jquery html css twitter-bootstrap

【解决方案1】：

.list-group-item 是多个，所以你需要循环遍历它，

$('#starredList').children('.list-group-item').each(function(){
  if($(this).children('.a-file').text() == file){
     $(this).remove();
  }
});

【讨论】：

【解决方案2】：

应该这样做。

var file = $(this).closest('.list-group-item').children('.a-file').text();

$('.list-group-item').not($(this).closest('.list-group-item')).each(function(){
   if($(this).find('.a-file:contains('+file+')').length > 0){
       $(this).remove();
   }
});

【讨论】：