javascript – 如何在多个节点上使用MutationObserver？

以下代码允许我在单个节点上侦听类更改：

var target = $(".right-border")[0]

var observer = new MutationObserver(function(mutations) {
mutations.forEach(function(mutation) {
console.log(“Change”)
  });
  });

  var config = { attributes: true, childList: true, characterData: true };

 observer.observe(target, config);

例如,如果我有一个div网格,并且右边框上的每个div都有一个右边框,我怎样才能听取每个div的变化？我知道我可以创建多个变量：

var target2 = $(".right-border")[1]
var target3 = $(".right-border")[2]

但是有更有效的方法来选择每个节点吗？是否可以在上面的代码中的某个地方使用for循环,以一类右边界为目标的每个div？

解决方法:

您可以使用jQuery的每个方法迭代所有匹配的DOM节点并观察其突变.代码几乎就是你已经拥有的 – 请注意target = this,这是每个节点的目标.

var config = { attributes: true, childList: true, characterData: true };

$(".right-border").each(function () {
  var target = this;
  var observer = new MutationObserver(function(mutations) {
    mutations.forEach(function(mutation) {
      console.log("Change")
    });
  });

  observer.observe(target, config);
});

标签：javascript,dom,mutation-observers
来源： https://codeday.me/bug/20190627/1307373.html