Question

我希望使用MutationObserver来听取div的高度，但是当我向我想要观察的元素的innerHTML添加文本时它不会被触发。

HTML：

<button onclick="myFunction()">click me</button>
<div id="support"></div>
<div id="info"></div>
<div id="text"></div>

JS：

var myFunction = function() {
  var tmp = document.getElementById('text').innerHTML;
  document.getElementById('text').innerHTML = tmp + "herro<br>";
};

if ("MutationObserver" in window) {
  document.getElementById('support').innerHTML = "MutationObserver supported";
  var observer = new MutationObserver(function (mutations) { // <- this isn't firing
    mutations.forEach(function (mutation) {
      var tmp = document.getElementById('info').innerHTML;
      document.getElementById('info').innerHTML = tmp + mutation.type + "<br>";
    });
  });

  var observerConfig = {
    attributes: true,
    childList: true,
    characterData: true
  };
  nodes
  var targetNode = document.getElementById('text');
  observer.observe(targetNode, observerConfig);
}

codepen：http://codepen.io/basickarl/pen/xZXWoK?editors=101

我想知道我做错了什么。

Answer 1

控制台显示：Uncaught ReferenceError: nodes is not defined

删除nodes行为我修复了它：http://codepen.io/anon/pen/jWGdqO?editors=101

祝你好运！

MutationObserver检查div高度（mutation.type）

1 个答案: