IntersectionObserver.IntersectionObserver()

这是一个实验中的功能
此功能某些浏览器尚在开发中，请参考浏览器兼容性表格以得到在不同浏览器中适合使用的前缀。由于该功能对应的标准文档可能被重新修订，所以在未来版本的浏览器中该功能的语法和行为可能随之改变。

IntersectionObserver()构造器创建并返回一个IntersectionObserver对象。检查rootMargin(如果指定)是否符合语法规定，检查所有指定的阈值(thresholds)是否在0.0和1.0之间，并且阈值列表会按升序排列。如果阈值列表为空，则默认为一个[0.0]的数组(Array).

语法

var observer = new IntersectionObserver(callback[, options]);

参数

callback

当元素可见比例超过指定阈值后，会调用一个回调函数，此回调函数接受两个参数：

entries: 一个IntersectionObserverEntry对象列表(list)，每个被触发的阈值，都会较指定阈值有偏差(或超出或少于指定阈值)。
observer: 被调用的IntersectionObserver实例。

options 可选

一个可以用来配置observer实例的对象。如果options未指定，observer实例默认使用viewport作为根(root)，并且没有margin, 阈值为0% (意味着即使一像素的改变都会触发回调函数)。你可以指定以下配置：

root: 监听元素的祖先元素Element对象，其边界盒将被视作viewport。目标在根的可见区域的的任何不可见部分都会被视为不可见。
rootMargin: 一个在计算交叉值时添加至根的边界盒(bounding_box)中的一组偏移量，类型为字字符串(string) ，可以有效的缩小或扩大根的判定范围从而满足计算需要。语法大致和CSS 中的margin 属性等同; 可以参考 "The root element and root margin" in Intersection Observer API来深入了解margin的工作原理及其语法。默认值是"0px 0px 0px 0px".
threshold: 规定了一个监听目标与边界盒交叉区域的比例值，可以是一个具体的数值或是一组0.0到1.0之间的数组。若指定值为0.0，则意味着监听元素即使与根有1像素交叉，此元素也会被视为可见. 若指定值为1.0，则意味着整个元素都是可见的(此段英文原文直译，正确性有待验证) 。可以参考"Thresholds" in Intersection Observer API 来深入了解阈值是如何使用的。阈值的默认值为0.0.

返回值

一个可以使用规定阈值(thresholds)监听目标元素可见部分与根(root)交叉状况的IntersectionObserver 实例。调用自身的observe() 方法开始使用规定的阈值监听指定目标。

异常

SyntaxError: 指定的rootMargin不存在。
RangeError: 一个或多个阈值超出了0.0到1.0的范围。

规范

规范	状态	Comment
Intersection Observer IntersectionObserver constructor	Editor's Draft	Initial definition.

Feature	Chrome	Edge	Firefox	Internet Explorer	Opera	Safari
Basic Support	51	15	53 — 55¹ 55	No	?	?

Feature

Chrome

Edge

Firefox

Internet Explorer

Opera

Safari

Basic Support

53 — 55¹

Feature	Android	Chrome for Android	Edge mobile	Firefox for Android	IE mobile	Opera Android	iOS Safari
Basic Support	51	51	(Yes)	?	No	?	?

1. From version 53 until version 55 (exclusive): this feature is behind the dom.IntersectionObserver.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.

语法

参数

返回值

异常

规范

浏览器兼容

文档标签和贡献者