使用自定义事件跟踪属性更改

Question

我的问题是我想跟踪使用自定义事件的元素的属性更改，我一直在阅读mozilla开发人员，但我仍然不明白。

那么，自定义事件是如何工作的？以及如何使用它来跟踪属性更改/变量（类的变化）。

Answer 1

Standard event listeners回应很多事情，但元素属性更改不是其中之一。 A MutationObserver真的是自己构建这样的东西的唯一方法，缺少资源匮乏的人工听众setInterval。

var target = document.querySelector('button'); 

var observer = new MutationObserver(function(mutations) { 
    mutations.forEach(function(mutation) { 
    console.log(mutation.attributeName + ' atrribute was changed.'); 
    });  
}); 

observer.observe(target, { 
    attributes: true 
}); 

这里是一个JSFiddle，其中一个按钮，点击更改元素的颜色，这是由MutationObserver回升。