当Css类发生变化时运行函数

当CSS类发生变化时运行函数，可以通过监听CSS类的变化来触发相应的函数执行。在前端开发中，可以使用MutationObserver来实现这个功能。

MutationObserver是一个用于监听DOM树变化的API，可以观察到节点的添加、删除、属性变化等操作。通过监听目标元素的class属性的变化，当class发生变化时，可以执行相应的函数。

具体实现步骤如下：

创建一个MutationObserver对象，传入一个回调函数作为参数。
使用observe方法开始监听目标元素的变化，传入目标元素和一些配置选项。
在回调函数中，判断变化类型是否为attributes（属性变化），并且判断属性名是否为class。
如果是class属性发生变化，则执行相应的函数。

示例代码如下：

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

// 创建MutationObserver对象
const observer = new MutationObserver(function(mutationsList) {
  for(let mutation of mutationsList) {
    if (mutation.type === 'attributes' && mutation.attributeName === 'class') {
      // class属性发生变化，执行相应的函数
      myFunction();
    }
  }
});

// 开始监听目标元素的变化
observer.observe(targetElement, { attributes: true });

// 目标元素的class发生变化时会触发该函数
function myFunction() {
  console.log('Class changed!');
  // 执行其他操作
}

这样，当目标元素的class属性发生变化时，就会触发myFunction函数的执行。

推荐的腾讯云相关产品：无

参考链接：