JavaScript: Прослушать изменение атрибута?

Question

Возможно ли в JavaScript прослушать изменение значения атрибута? Например:

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

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

function doit() { 

} 

Я хотел бы ответить на любые изменения атрибута something.

Я прочитал объект MutationObserver, а также альтернативы этому (в том числе тот, который использует анимационные события). Насколько я могу судить, речь идет об изменениях в реальном DOM. Меня больше интересуют изменения атрибутов для конкретного элемента DOM, поэтому я не думаю, что это так. Конечно, в моих экспериментах это не работает.

Я хотел был бы это сделать без jQuery.

Благодаря

Answer 1

Вам нужно MutationObserver, здесь во фрагменте кода я использовал setTimeout для имитации атрибуту модифицирующих

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>