观察元素变化

创建一个新的MutationObserver，并对指定元素上的每个变化运行提供的回调函数。

• 使用MutationObserver来观察给定元素上的变化。
• 使用Array.prototype.forEach()来对观察到的每个变化运行回调函数。
• 省略第三个参数options，以使用默认的选项（全部为true）。

const observeMutations = (element, callback, options) => {
  const observer = new MutationObserver(mutations =>
    mutations.forEach(m => callback(m))
  );
  observer.observe(
    element,
    Object.assign(
      {
        childList: true,
        attributes: true,
        attributeOldValue: true,
        characterData: true,
        characterDataOldValue: true,
        subtree: true,
      },
      options
    )
  );
  return observer;
};

const obs = observeMutations(document, console.log);
// 记录页面上发生的所有变化
obs.disconnect();
// 断开观察器并停止记录页面上的变化