铬突变观察者

Chrome Mutation Observer

本文关键字：观察者 突变      更新时间：2023-09-26

我试图在Chrome中使用突变观察者来监控何时添加新图像，这是我的代码到目前为止:

var observer = new window.MutationObserver(function (mutations) {
    mutations.forEach(function (mutation) {
        var m = mutation;
        //console.log(m);
        for (var j = 0; j < m.addedNodes.length; j++)
        {
            var nodes=m.addedNodes[j];
            if (!nodes || !nodes.querySelectorAll)
            {
                // Not all nodes support querySelectorAll, e.g. text nodes.
                continue;
            }
            var imgs= nodes.querySelectorAll("img");
            for (var k = 0; k < imgs.length; k++)
            {
                if(imgs[k].src != undefined)
                {
                    var img = imgs[k];
                    console.log(img);
                }
            }
        }
    });
});
var config = { childList: true };
// pass in the target node, as well as the observer options
observer.observe(window.document, config);

一个奇怪的事情正在发生:回调似乎被调用，但没有找到任何图像。当我打开控制台(Ctrl+Shift+J)时，代码开始正常工作，从该点添加的所有图像都打印出来。当我重新设置打开的控制台的大小时，也会发生同样的事情。

我必须为配置值设置额外的参数吗?为什么打开控制台突然使代码工作?

文档的子列表几乎从不改变。通常只有一个<html>子结点。你可能想要subtree: true在你的config，所以观察者会运行，如果一个图像被添加到文档的深处。

这并不能解释为什么当控制台打开时代码还在工作。

相关文章：