如何在新创建的窗口上使用 MutationObserver

ben*_*ams 5 javascript asynchronous window.open mutation-observers

我想使用 MutationObserver 来跟踪我使用window.open. 我有以下代码:

var newWin = window.open('/somepath');
var observerConfig = {
    childList: true,
    subtree: true,
    attributes: false,
    characterData: false
};
var obs = new newWin.MutationObserver(function(mutations) {
    mutations.forEach(function(mutation) {
        if (!mutation.addedNodes) return;
        mutation.addedNodes.forEach(function(addedNode) {
            console.log(addedNode);
        });
    })
});
obs.observe(newWin.document, observerConfig);
Run Code Online (Sandbox Code Playgroud)

我希望看到一些新添加的节点记录在控制台中(正如我以相同的方式跟踪原始窗口时得到的那样,相同的观察者),但我什么也没得到。我错过了什么吗?

Séb*_*ien 2

<head>这与在加载 DOM 之前使用 JavaScript(例如来自脚本)修改当前文档的 DOM 时遇到的问题相同:此时您将尝试访问内存中不存在的元素时间。

DOMContentLoaded当 DOM 已加载并准备好进行操作时,您可以使用该事件触发回调。

同样,当您尝试访问新窗口的 DOM 时,该窗口可能尚未完成加载。

您应该将调用obs.observe包装在事件侦听器中load

newWin.addEventListener('load', function() {
    obs.observe(newWin.document.body, observerConfig);
}, true);
Run Code Online (Sandbox Code Playgroud)

这样,当你开始观察身体时,你就确信它确实存在!