Question

我正在尝试使用Chrome中的Mutation Observer来监控添加新图片的时间，这是我目前的代码：

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 ）时，代码开始正常工作，所有图像当我重新调整控制台的大小时，就会发生同样的事情。

我是否必须为配置值设置其他参数？为什么打开控制台突然使代码工作？

Answer 1

文档的子列表几乎不会更改。它通常只是一个<html>孩子。您可能希望在subtree: true中使用config，这样如果在文档的深处添加了图像，观察者就会运行。

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

Chrome Mutation Observer

1 个答案: