监听元素的变化

282 阅读1分钟

在项目中,遇到监听其中一个元素的变化,来进行动态变化其他元素的要求,百度到都是window.onresize,没找到对单个元素的监听,下面是大牛推荐的方法: MutationObserver

var MutationObserver = window.MutationObserver ||
    window.WebKitMutationObserver || window.MozMutationObserver; //浏览器兼容
var config = { attributes: true, childList: true} //配置对象
$("要监听的DOM元素").each(function(){
   var _this = $(this);
   var observer = new MutationObserver(function(mutations) {//构造函数回调
      mutations.forEach(function(record) {
         if(record.type == "attributes"){//监听属性
            console.log('change');
         }
         if(record.type == 'childList'){//监听结构发生变化
              //do any code
         }
      });
   });
   observer.observe(_this[0], config);
});