IntersectionObserver.observe收藏我的收藏
收藏
我的收藏基础库 1.10.4 开始支持本方法,这是一个同步方法。
指定目标节点并开始监听目标节点和参照区域相交状态的变化情况。
语法
intersectionObserver.observe(selector, callback)
参数说明
selector
类型 | 默认值 | 必填 | 说明 | 最低支持版本 |
string | | 是 | 选择器字符串 | 1.10.4 |
callback
类型 | 默认值 | 必填 | 说明 | 最低支持版本 |
callback | | 是 | 监听相交状态变化的回调函数 | 1.10.4 |
回调函数参数说明
object 类型,属性如下:
属性名 | 类型 | 说明 | 最低支持版本 |
id | string | 目标节点的 id | 1.10.4 |
dataset | object | 目标节点的 dataset | 1.10.4 |
intersectionRatio | number | 目标节点与参照区域的相交比例。范围 [0, 100],可能是浮点数 | 1.10.4 |
intersectionRect | Rect | 目标节点与参照区域相交范围的边界信息 | 1.10.4 |
boundingClientRect | Rect | 目标节点的边界信息 | 1.10.4 |
relativeRect | RelativeRect | 参照区域的边界信息 | 1.10.4 |
time | number | 相交检测时的时间戳 | 1.10.4 |
Rect 类型说明
object 类型,属性如下:
属性名 | 类型 | 说明 | 最低支持版本 |
left | number | 区域左边界到屏幕左侧的距离 | 1.10.4 |
right | number | 区域右边界到屏幕左侧的距离 | 1.10.4 |
top | number | 区域上边界到屏幕上侧的距离 | 1.10.4 |
bottom | number | 区域下边界到屏幕上侧的距离 | 1.10.4 |
width | number | 区域的宽度, 即: width = right - left | 1.10.4 |
height | number | 区域的高度, 即: height = bottom - top | 1.10.4 |
RelativeRect 类型说明
object 类型,属性如下:
属性名 | 类型 | 说明 | 最低支持版本 |
left | number | 参照区域左边界到屏幕左侧的距离 | 1.10.4 |
right | number | 参照区域右边界到屏幕左侧的距离 | 1.10.4 |
top | number | 参照区域上边界到屏幕上侧的距离 | 1.10.4 |
bottom | number | 参照区域下边界到屏幕上侧的距离 | 1.10.4 |
返回值
无
扫码体验
代码示例
Bug & Tip
无