2000字范文,分享全网优秀范文,学习好帮手!
2000字范文 > 监听 html dom 变化 js怎么监听元素属性变化

监听 html dom 变化 js怎么监听元素属性变化

时间:2021-07-19 06:57:52

相关推荐

监听 html dom 变化 js怎么监听元素属性变化

我觉得MutationObserver可以用啊,正常情况下,这个等待DOM操作结束再执行的异步回调没什么问题吧。什么业务实时性要那么高啊? 一般一个事件里面同步的不会有同个属性改来改去的情况(有这种情况优化代码更好),如果是异步的,那MutationObserver也会异步调用,倒没什么问题

test

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

var element = document.querySelector('#test');

var observer = new MutationObserver(function(mutations) {

mutations.forEach(function(mutation) {

if (mutation.type == "attributes") {

console.log('mm', new Date().getTime())

console.log("attributes changed", mutation.attributeName)

}

});

});

observer.observe(element, {

attributes: true //configure it to listen to attribute changes

});

function clickMe(){

console.log('111', new Date().getTime())

element.style.left = Math.random()* 10 + 'px';

console.log('222', new Date().getTime())

element.style.left = Math.random()* 10 + 'px';

setTimeout(function(){

console.log('333-timeout', new Date().getTime())

element.style.left = Math.random()* 10 + 'px';

}, 2000)

console.log('click-end')

}

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。