JavaScript 监听 Div 高度变化 - 使用 MutationObserver

要监听div的高度变化，可以使用MutationObserver来监视div元素的属性变化。具体步骤如下：\n\n1. 获取要监听的div元素，并将其存储在变量中。\n\njavascript\nconst targetDiv = document.querySelector("#target-div");\n\n\n2. 创建一个MutationObserver对象，并指定一个回调函数来处理变化。\n\njavascript\nconst observer = new MutationObserver(callback);\n\n\n3. 定义回调函数，用于处理div的高度变化。\n\njavascript\nfunction callback(mutationsList, observer) {\n for(let mutation of mutationsList) {\n if (mutation.type === 'attributes' && mutation.attributeName === 'style') {\n console.log('Div的高度发生了变化');\n // 处理高度变化的逻辑...\n }\n }\n}\n\n\n4. 将要观察的属性配置添加到观察者对象中。\n\njavascript\nconst config = { attributes: true, attributeFilter: ['style'] };\nobserver.observe(targetDiv, config);\n\n\n现在，当div的高度发生变化时，回调函数将被触发，并执行相应的逻辑。\n\n注意：这种方法只能监听到div的style属性的变化，如果div的高度是通过其他方式改变的（如内容变化、窗口大小改变等），则需要使用其他方法来监听。