监控div的class是否变化

监控`<div>`元素的`class`属性变化通常是前端JavaScript操作，特别是使用现代浏览器的事件模型和DOM API。你可以通过以下几种方法实现：

1. **MutationObserver** (推荐)：这是一个强大的API，用于观察指定节点的子树结构或者属性的变化。创建一个`MutationObserver`实例，给它提供一个回调函数，在这个函数里检查`class`属性的变化。

const targetDiv = document.querySelector('.your-div');
const observer = new MutationObserver(mutations => {
  mutations.forEach(mutation => {
    if (mutation.type === 'attributes' && mutation.attributeName === 'class') {
      const currentClass = targetDiv.className;
      // 在这里处理class变化
      console.log('Class changed:', currentClass);
    }
  });
});
observer.observe(targetDiv, { attributes: true }); // 观察class属性的变化

2. **Event监听**：如果你只需要监听特定的class添加或删除，可以使用`addEventListener`来监听`'classlistchange'`事件。

targetDiv.addEventListener('classlistchange', function() {
  const classes = this.classList;
  if (classes.contains('new-class')) {
    // 类添加
  } else if (classes.contains('removed-class')) {
    // 类移除
  }
});

3. **定期检查**：也可以选择定时轮询的方式，每隔一段时间检查一次class属性是否有变更，但这不是最优方案，因为它可能会增加不必要的网络请求或性能开销。

无论哪种方法，记得在不需要监控时调用相应API停止观察。