带选择器的jQuery .remove()不起作用

Question

根据.remove()| jQuery API文档,将选择器作为可选参数包含在内是完全有效的.remove().引用:

我们还可以包含一个选择器作为可选参数.例如,我们可以重写以前的DOM删除代码,如下所示:

$( "div" ).remove( ".hello" );

所以我写了2个div来测试这个:

<div id="div1">test
    <div id="div2">Remove</div>
</div>

使用它作为jQuery:

$( document ).ready(function() {
    $( "#div1" ).remove( "#div2" );
});

它没有按预期删除div.结果是:

测试
删除

而是使用:

$( document ).ready(function() {
    $("#div2").remove();
});

按预期删除div.那我在这里错过了什么？文档错了吗？我误解了什么吗？

Answer 1

你误解了选择器参数的作用.它正在过滤第一组对象.

来自文档:

一个选择器表达式,用于过滤要删除的匹配元素集.

因此,您的"#div2"选择器不作为"#div1"元素的一部分存在.例如,假设我有以下内容:

<div class="red">Red</div>
<div class="red">Red</div>
<div class="red">Red</div>
<div class="red notneeded">Red</div>
<div class="red notneeded">Red</div>
<div class="red">Red</div>

然后,我打电话给以下人员:

$(function () {
  $("div.red").remove(".notneeded");
});

我将留下以下内容:

<div class="red">Red</div>
<div class="red">Red</div>
<div class="red">Red</div>
<div class="red">Red</div>

因此,jQuery匹配集是所有具有类的div red- 第二个选择器(".notneeded")将过滤具有类的那个的第一个匹配集notneeded- 然后它将删除它们.