當前位置：
首頁 >
前端技术
> javascript
>内容正文
javascript
JS监听DOM宽高的变化
生活随笔
收集整理的這篇文章主要介紹了
JS监听DOM宽高的变化
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
在 JS里面 resize 方法可以監聽 window 窗口的大小變化，如果要監聽某個Dom的變化話需要用到 MutationObserver 來去監聽了，示例代碼如下。
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title></title><style>#pp {width: 200px;height: 200px;background-color: pink;}</style> </head> <body><p id="pp"></p><button id="btn">btn</button><script>var oP = document.getElementById('pp');let MutationObserver = window.MutationObserver || window.WebKitMutationObserver || window.MozMutationObserver;let observer = new MutationObserver(function (mutations) {console.log("asdf", mutations);});observer.observe(oP, {attributes: true,attributeFilter:['style'],attributeOldValue:true});document.getElementById('btn').onclick = function () {oP.style.width = '300px';}</script></body> </html>具體的使用、API、兼容性不再說了。
總結
以上是生活随笔為你收集整理的JS监听DOM宽高的变化的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 新书首发 | 《机器学习 公式推导与代码
- 下一篇： 【学术相关】普通在读奶爸博士生的一年总结