如何使用突变观察器而不是设置超时来附加 div

Question

我有js代码，如果DOM中存在具有特定类的元素，则会附加一个div。 这是代码。第一步的步骤创建一个具有分词类的div。然后它检查 Dom 是否有带有类 id 横幅的元素，如果有，那么它将使用 insertBefore 附加创建的div。我正在使用它，因为横幅元素是动态添加到 dom 中的，并不总是存在于 dom 中。 这工作正常。

var overlayelem = document.createElement('div');
overlayelem.setAttribute("class", "overlay");
setTimeout(function(){
var elem = document.getElementById('banner');
elem.parentNode.insertBefore(overlayelem, elem.nextSibling);
}, 10)

但问题是我不能完全依赖 setTimeout，我希望使用突变 ovberser 来实现这一点，所以尝试使用它和代码是这样的(删除了 setTimeout(

var overlayelem = document.createElement('div');
overlayelem.setAttribute("class", "overlay");

var observer = new MutationObserver(function(mutations) {
mutations.forEach(function(mutation) {
if (mutation.type == "childList")  {
var elem = document.getElementById('banner');
if(elem) {
elem.parentNode.insertBefore(overlayelem, elem.nextSibling);
}
}
})
})
var elemBody = document.getElementById("body")
observer.observe(elemBody, {
childList: true,
subtree: true,
})

但这无法正常工作.该网站不断加载，永不停止。谁能帮助解决突变者的问题。

Answer 1

刚刚失去了observer.disconnect();？

observer.observe(elemBody, {
childList: true,
subtree: true,
})
//like this
observer.disconnect();