js：MutationObserver监视 DOM 节点的变化

<div id="some-id"></div>
<script>
  // 选择需要观察变动的节点
  const targetNode = document.getElementById("some-id");
  // 观察器的配置（需要观察什么变动）
  const config = {
    attributes: true, // 观察属性变动
    childList: true,  // 观察目标子节点的变化，是否有添加或者删除
    subtree: true,    // 观察后代节点
  };
  // 当观察到变动时执行的回调函数
  const callback = function (mutationsList, observer) {
    for (let mutation of mutationsList) {
      console.log(mutation);
      if (mutation.type === "childList") {
        console.log("A child node has been added or removed.");
      } else if (mutation.type === "attributes") {
        console.log(mutation.attributeName);
      }
    }
  };
  // 创建一个观察器实例并传入回调函数
  const observer = new MutationObserver(callback);
  // 以上述配置开始观察目标节点
  observer.observe(targetNode, config);
  // 之后，可停止观察
  //   observer.disconnect();
</script>