<div :class="['div',div?'big':'small']" id="div"></div> <button @click="changediv">按钮</button> <button @click="changetext">按钮2</button>
.div { background: rebeccapurple; } .big { width: 200px; height: 200px; } .small { width: 100px; height: 100px; }
data: { div: false }, methods: { changediv() { this.div = !this.div; }, changetext() { let target = document.querySelector('#div'); target.append('123') }, },
let MutationObserver = window.MutationObserver || window.WebKitMutationObserver || window.MozMutationObserver; let target = document.querySelector('#div');
//创建观察者对象 let observer = new MutationObserver(function (mutations) { mutations.forEach(function (mutation) { console.log(mutation) }); });
//配置观察者选项 let config = { attributes: true,//检测属性变动 childList: true,//检测子节点变动 characterData: true//节点内容或节点文本的变动。 };
// 传入目标节点和观察选项
observer.observe(target, config);
// 停止观察
observer.disconnect();