jQuery，从克隆元素中删除带有类的所有实例

Question

尝试使用 jQuery 从带有子元素的克隆元素中删除具有特定类的所有选择器。原始标记:

<div id="el">
  <div class="remove">remove from clone</div>
  <div class="remain">remain in clone</div>
  <div class="remove">remove from clone</div>
  <div class="remain">remain in clone</div>
  <div class="remove">remove from clone</div>
  <div class="remain">remain in clone</div>
</div>

克隆版本应如下所示:

<div id="el">
  <div class="remain">remain in clone</div>
  <div class="remain">remain in clone</div>
  <div class="remain">remain in clone</div>
</div>

jQuery 代码(不适合我的目的):

var clone = $('#el').clone();
clone = $(clone).remove('.remove');
clone = clone.html();
console.log(clone);

当我登录查看克隆中是否存在删除元素时，它会输出正确的数字:

console.log($(clone).find('.remove').length);

任何人都可以提供帮助。非常感谢! (不过可能重复)

Answer 1

您对 remove() 的使用不太正确，因为您提供的选择器用于过滤当前元素集，而不是查找 在其中。

要实现您的要求，您需要分别使用 find() 和 remove()，如下所示:

var $clone = $('#el').clone();
$clone.find('.remove').remove();
var clone = $clone.html();
console.log(clone);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="el">
  <div class="remove">remove from clone</div>
  <div class="remain">remain in clone</div>
  <div class="remove">remove from clone</div>
  <div class="remain">remain in clone</div>
  <div class="remove">remove from clone</div>
  <div class="remain">remain in clone</div>
</div>