原生js 每分钟监听某个元素的数据变化,并把变化值记录下来

实现这个功能可以使用 MutationObserver API，该 API 可以监听指定的 DOM 节点，一旦节点的子节点或属性发生变化，就会触发回调函数。你可以在回调函数中获取到变化后的节点信息并记录下来。

以下是一个示例代码，它每分钟监听 id 为 “target” 的元素的文本内容变化，并把变化的值记录到数组中：

// 获取目标元素
const target = document.getElementById('target');

// 创建 MutationObserver 实例
const observer = new MutationObserver((mutationsList, observer) => {
  // 遍历所有变化
  for (let mutation of mutationsList) {
    // 如果是子节点的文本内容变化
    if (mutation.type === 'childList' && mutation.target === target && mutation.addedNodes.length > 0) {
      // 记录变化的值
      const value = target.textContent;
      console.log('Value changed:', value);

      // 将值记录到数组中
      values.push(value);
    }
  }
});

// 启动监听
observer.observe(target, { childList: true });

// 每分钟输出一次记录的变化值
setInterval(() => {
  console.log('Recorded values:', values);
}, 60000);

在上面的代码中，我们先获取了 id 为 “target” 的元素，然后创建了一个 MutationObserver 实例。我们通过 `observe` 方法来启动对目标元素的监听，设置 `childList` 为 true，表示要监听子节点的变化。

在回调函数中，我们遍历了所有的变化，如果发现是目标元素的子节点的文本内容发生了变化，就记录下来，并把值存储到数组中。

最后，我们使用 `setInterval` 方法每分钟输出一次记录的变化值。