页面可见性(visibilitychange)
当浏览器标签页切换显隐后触发,一般配合document.hidden属性使用,如页面切换暂停或续播视频即可使用该api来做

元素可见性(IntersectionObserver)
监听元素由不可见到逐步可见的各个阶段,如在分页列表中,监听最后一个元素显示出来二分之一时发起分页请求

元素属性变化(MutationObserver)
当元素属性(大小、样式、子节点)发生变化时触发回调,这可以做一些对用户修改的回退操作

元素尺寸改变(ResizeObserver)
通过监听元素尺寸变化,我们可以拿到其修改后的宽高及页面位置,这在低代码的视图面板中通过拖拽修改元素大小时很有用

网友评论