Question

在JavaScript中是否可以侦听属性值的更改？例如：

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

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

function doit() {

}

我想回复something属性中的任何更改。

我已经阅读了MutationObserver对象，以及它的替代品（包括使用动画事件的对象）。据我所知，它们是关于实际DOM的变化。我对特定DOM元素的属性更改更感兴趣，所以我不认为就是这样。当然，在我的实验中它似乎不起作用。

我想这样做没有 jQuery。

由于

Answer 1

您需要MutationObserver，我在片段中使用setTimeout来模拟修改属性

＆＃13;

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
});

＆＃13;

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

＆＃13;

JavaScript：听取属性更改？

1 个答案: