JavaScript：属性の変更をリッスンしますか？

Question

JavaScriptで属性値の変更をリッスンすることはできますか？たとえば：

var element=document.querySelector('…'); 
element.addEventListener(? ,doit,false); 

element.setAttriubte('something','whatever'); 

function doit() { 

} 

私はsomething属性内の任意の変化に対応したいと思います。

私はMutationObserverオブジェクトとその代替案（アニメーションイベントを使用するものを含む）について読んでいます。私が知る限りでは、実際のDOMの変更に関するものです。私は、特定のDOM要素の属性の変更にもっと関心があるので、そうは思わない。確かに私の実験ではうまくいかないようです。

jQueryなしでこれを行いたいと思います。あなたがMutationObserverが必要

おかげ

Answer 1

は、ここでスニペットで私はそのために働くMutationObserver`属性

var MutationObserver = window.MutationObserver || window.WebKitMutationObserver || window.MozMutationObserver; 
 

 
var element = document.querySelector('#test'); 
 
setTimeout(function() { 
 
    element.setAttribute('data-text', 'whatever'); 
 
}, 5000) 
 

 
var observer = new MutationObserver(function(mutations) { 
 
    mutations.forEach(function(mutation) { 
 
    if (mutation.type == "attributes") { 
 
     console.log("attributes changed") 
 
    } 
 
    }); 
 
}); 
 

 
observer.observe(element, { 
 
    attributes: true //configure it to listen to attribute changes 
 
});

<div id="test"> 
 
</div>