仅在父元素上触发突变观察者

问题描述 投票:0回答:1

我正在尝试使用MutationObserver来监视应用程序库中已删除的节点,但是当父级被删除(或替换)时,它不会触发所有子元素的回调。

<button class="RemoveListButton">Remove List</button>
<div class="Container">
  <ul class="ShoppingList">
    <li class="Item">Pasta</li>
    <li class="Item">Chips</li>
    <li class="Item">Salsa</li>
  </ul>
</div>
const removeWatcher = new MutationObserver(mutationList => {
    const removedNodes = mutationList.flatMap(m => [...m.removedNodes])
    console.log('Removing', removedNodes)
})

const container = document.querySelector('.Container')
removeWatcher.observe(container, { subtree: true, childList: true })

/* additional javascript to remove elements on click */

请参见JSFiddle https://jsfiddle.net/eq4ahsvc/3/

在示例中,当我删除单个列表项(通过单击它)时,我在控制台中看到该元素已被删除,并且被突变观察者看到。

但是,当我删除整个列表时,只会为父级而不是单个子级元素触发Mutation Observer回调。

是否可以配置此行为?理想情况下,每个元素都将触发MutationObserver回调,以便在删除列表时,我看到删除列表的触发器以及删除每个子元素的触发器。

javascript dom mutation-observers
1个回答
0
投票

子元素从其父元素中被not

© www.soinside.com 2019 - 2024. All rights reserved.