javascript - 如何使用 Chrome/Firefox 扩展阻止将新节点添加到 DOM？

Question

我正在编写一个扩展来检测某些脚本的某些恶意行为。这些脚本在页面加载后将一些节点添加到 DOM 中。我可以使用

获取这些节点

document.addEventListener("DOMNodeInserted", checkContents, false);

但是我怎样才能阻止它们被加载呢？这可以在 Chrome 或 Firefox 中完成吗？

Answer 1

将 MutationObserver 与 childList 和子树一起使用。

var grid = iframe.contentDocument.getElementById('newtab-grid');
var mobs = new iframe.contentWindow.MutationObserver(function(mutations) {
    mutations.forEach(function(mutation) {
        console.log(mutation.type, mutation);
        if (mutation.addedNodes && mutation.addedNodes.length > 0) {
            var link = mutation.target.querySelector('.newtab-link');
            if (link) {
                link.setAttribute('target', '_parent');
                console.log('set target on this el')
            } else {
                console.log('this ell has no link BUT it was an added el')
            }
        }
    });
});
mobs.observe(grid, {
    childList: !0,
    subtree: !0
});

现在，这将告诉您何时添加节点，并为您提供在 mutation.addedNodes 中添加的内容。您可以迭代并删除添加的内容。我不确定您是否可以阻止它添加，但您绝对可以在添加后将其删除。

https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver?redirectlocale=en-US&redirectslug=DOM%2FMutationObserver#MutationObserverInit