使用MutationObserver捕获类更改

时间:2016-05-20 21:09:45

标签: javascript jquery

我在确定为什么没有在每个函数中删除类时遇到问题。我想检查并查看包含特定类的元素是否被某些其他事件或函数以某种方式被操纵。

此代码未成功从内容元素中删除“cc-gone”类。

var content = form.find('.cc-form-content-container');

$(content).each(function() {
  $(this).removeClass('cc-gone');      
  console.log('unhiding content containers: '+content.attr('class')); //output looks ok - unhiding content containers: cc-form-content-container
});

我尝试添加MutationObserver,复制演示,稍作修改(要跟踪的类名和控制台输出):

// select the target node
var target = document.querySelector('.cc-form-content-container');

// create an observer instance
var observer = new MutationObserver(function(mutations) {
  mutations.forEach(function(mutation) {
    console.log('mutation: '+mutation.type);
  });
});

// configuration of the observer:
var config = { attributes: true, childList: true, characterData: true };

// pass in the target node, as well as the observer options
observer.observe(target, config);

// later, you can stop observing
observer.disconnect();

然而,控制台没有任何与mutation.forEach匹配的输出,我通过在每个循环中添加$(this).addClass('x')来测试它,并在控制台中检查是否添加了类到元素。

希望SO社区中的某个人可以帮助指出使用MutationObserver来解决我的问题的正确方法,或者找出为什么'cc-gone'类没有被'cc-从元素中移除'的方法form-content-container'类。我查看了一些关于SO的其他MutationObserver问题,但没有找到一个清晰易懂的“如何”处理我的特定情况。

感谢任何帮助!

0 个答案:

没有答案