JS监控CSS属性更改，如“display：none”=>“display：block”？ [英] JS to monitor the CSS property change like "display:none"=>"display:block"?

问题描述

当图片的CSS属性display已被任何其他JS脚本/函数更改时，我想运行一些JS代码。有没有任何方法来监视该更改并设置回调函数？

  $（this）.bind（'propertychange'，function（）{}）
  
 
 
 
不能这样做，setInterval也是一个坏主意。
 
 
 
 
解决方案
这是您要查找的内容：
  document.documentElement.addEventListener（'DOMAttrModified'，function（e）{
 if（e.attrName ==='style'）{
 console.log （'prevValue：'+ e.prevValue，'newValue：'+ e.newValue）; 
} 
}，false）; 
  
 
I want to run some JS code when an image's CSS property "display" has been changed by any other JS script/functions. Is there any method to monitor that change and setup a callback function? 
$(this).bind.('propertychange', function(){}) 
cannot do this, and setInterval is also a bad idea.

What else could be done?
解决方案
This is what you are looking for:
document.documentElement.addEventListener('DOMAttrModified', function(e){
  if (e.attrName === 'style') {
    console.log('prevValue: ' + e.prevValue, 'newValue: ' + e.newValue);
  }
}, false);


                        
这篇关于JS监控CSS属性更改，如“display：none”=>“display：block”？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！