已见 DOM 个节点的哈希值

Question

我想将 MutationObserver 附加到 DOM 以便我可以看到有什么变化。简单。

var observer = new MutationObserver(function(mutations) {
  mutations.forEach(function(mutation) {
    processNode(mutation.target);
  });
});

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

问题出在 processNode 我想编辑节点，这会触发 MutationObserver 再次调用 processNode 双重编辑节点，这是我不想要的。

那么我怎样才能创建一个散列来跟踪我已经看过的内容呢？我尝试过的事情：

弱图

不起作用，因为所有节点在插入前都被序列化为字符串。所以我的钥匙变成了[object Text]。编辑：我在做 seenMap[node] = true 而不是 seenMap.set(node, true)。后者可以解决我的问题。

在节点上存储属性

我不想与页面上的任何其他内容运行发生冲突（我正在编写 Chrome 扩展）。

使用一组可见的 DOM 节点

我对每个 DOM 变化的线性搜索不太感兴趣。

Answer 1

向节点对象添加属性没有错。 JQuery 一直这样做，这在浏览器扩展中很常见。另外，我不是指像 <img data-foo="bar"/> 这样的元素属性。我的意思是在 JS 中向节点对象添加属性，例如

document.body.MY_WEIRD_PROP_348u9erhhhhh0asdf_IN_USE = 1

显然，您希望它是模糊的以完全避免碰撞。如果您能想到这会干扰另一个脚本的实例，请赐教。

已见 DOM 个节点的哈希值

Hash of seen DOM nodes

javascript

hash

dom

mutation-observers