javascript - 在插件中使用 MutationObservers

Question

我正在尝试在我的插件中使用 MutationObserver。因此，我注入(inject)一个内容脚本，然后设置观察者。这似乎有效，而且检测到的突变似乎无法序列化为 JSON。但实际上我想使用this用于监测突变的库。明确这个是官方的mentioned by Mozilla关于插件中的突变监控。但这根本不起作用。

那么有人在内容脚本中得到了一个工作突变观察者的工作示例(更好的突变总结 - 请参阅链接)吗？

我的代码如下所示:

var observer = new MutationObserver(function (mutations) {
  self.port.emit("domModified", mutations); //I gets received as 'Array [{}]'
  mutations.forEach(function (mutation) {
    console.log(mutation.type); //printing mutation results in {}, printing mutation.type results in an actual string
    console.log(mutation.target);
    console.log(mutation.addedNodes.length);
  });
});

observer.observe(unsafeWindow.document.body, {
  attributes: true,
  subtree: true,
  characterData: true,
  childList: true
});

Answer 1

This somehow seems to work, also the detected mutations seem not be be serializable to JSON.

突变是不可序列化的，特别是因为它们包含节点。如果您需要将内容脚本中的某些内容传递到主附加代码，则需要确保它们是 JSONable 值。

So anybody got a working example for a working mutation-observer (better mutation-summary - see link) inside a content-script?

我从未使用过你提到的库，但我经常使用突变观察器；他们工作得很好。您可以在此处查看示例:https://github.com/ZER0/tweet-to-read它基本上为流中包含外部 URL 的每条推文添加一个按钮；我需要突变观察者在未来的推文中添加按钮。您可以在这里查看实现:https://github.com/ZER0/tweet-to-read/blob/master/data/observable.js

希望有帮助。