用 IntersectionObserver 替代滚动监听：更准、更省、更简单
原创
用 IntersectionObserver 替代滚动监听：更准、更省、更简单
超哥前端记录
发布于 2026-10-07 09:42:50
发布于 2026-10-07 09:42:50
概述
页面里做懒加载、无限滚动、元素曝光埋点、吸顶导航切换时，很多项目第一反应还是给 window 挂一个 scroll 事件监听，在回调里用 getBoundingClientRect() 或者 offsetTop 判断元素是否进入视口。这个做法能跑，但代价不小：滚动事件触发频率极高，哪怕加了节流，每次回调仍然可能触发同步布局计算，导致样式重算和绘制排队；如果判断逻辑里读取了 offsetHeight
原创声明：本文系作者授权腾讯云开发者社区发表，未经许可，不得转载。
如有侵权，请联系 cloudcommunity@tencent.com 删除。
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号