handleResize() {
// let MutationObserver = window.MutationObserver || window.WebKitMutationObserver || window.MozMutationObserver
// let element = document.querySelector('.resize-element')
// console.log(
// 'elemet',element
// );
// this.observer = new MutationObserver((mutationList) => {
// for(let mutation of mutationList) {
// console.log('mutation.target',mutation);
// console.log('变化了嘛', mutation.target.clientHeight)
// this.resizeHeight = mutation.target.clientHeight - 40
// }
// let width = getComputedStyle(element).getPropertyValue('width')
// let height = getComputedStyle(element).getPropertyValue('height')
// if(width === this.recordOldValue.width && height === this.recordOldValue.height) return
// this.recordOldValue = {
// width,
// height
// }
// this.firedNum += 1
// })
// this.observer.observe(element, {
// attributes: true,
// attributeFilter: ['style'],
// attributeOldValue: true
// })
},
监听元素的变化
本文介绍了如何使用MutationObserver在JavaScript中监测`.resize-element`的选择器元素大小变化,以便动态更新高度并处理响应式设计中的尺寸调整事件。
摘要由CSDN通过智能技术生成