jQuery选择器 - 如果父div不具有特定ID，则删除元素

Question

假设以下标记：

<div id="NotificationBar">Stuff</div>
<div id="StatusBar>
    <p>Stuff</p>
</div>

<div id="myContainer>
    <div id="NotificationBar">Stuff</div>
    <div id="StatusBar>
        <p>Stuff</p>
    </div>
<div>

我想要的是以下内容：

• 如果#NotificationBar中的#StatusBar和#myContainer 不，请将其从DOM中删除

我想要的最终标记是：

<div id="myContainer>
    <div id="NotificicationBar">Stuff</div>
    <div id="StatusBar>
        <p>Stuff</p>
    </div>
<div>

我尝试了以下操作，但最终删除了不是我想要的整个父级：

$("#StatusBar").parent('div').not('#myContainer').remove()
$("#NotificationBar").parent('div').not('#myContainer').remove()

我不能只通过CSS隐藏内容，我真的需要从DOM中删除元素。

Answer 1

元素的ID必须为 唯一 ，因此请使用class对相似元素进行分组

<div class="NotificationBar">Stuff</div>
<div class="StatusBar">
    <p>Stuff</p>
</div>
<div id="myContainer">
    <div class="NotificationBar">Stuff</div>
    <div class="StatusBar">
        <p>Stuff</p>
    </div>
</div>

然后

$('.NotificationBar, .StatusBar').not('#myContainer .NotificationBar, #myContainer .StatusBar').remove()

演示：Fiddle