使用Intersection Observer API来实现当指定元素进入或离开视窗时执行相应的操作

// 匹配加载 选择器
var el = document.querySelector('.class');

// 建立观察者
var ob = new IntersectionObserver(function(entries){
	var entry = entries[0];

	// isIntersecting 为true 为进入，false为离开
	if(entry.isIntersecting) {

		// 进入视窗重叠 执行加载
		// console.log('执行加载');
	}
	
},{
	// 1 视窗重叠 0 视窗不重叠
	thresholds: 1
});

// 观察
ob.observe(el);

1、首先，通过document.querySelector('.class')方法选择了一个具有.class类名的元素，并将它赋值给变量el。

2、接着，创建了一个IntersectionObserver对象，并传入一个回调函数作为参数。这个回调函数将在观察的元素进入或离开视窗时被调用。

3、在回调函数中，通过entries参数获取了观察元素的相关信息。在这里，我们只获取了第一个entry。

4、使用entry.isIntersecting属性来判断观察元素是否进入视窗。如果isIntersecting为true，表示元素进入了视窗，我们可以在接下来的代码中执行相应的加载操作。

5、在观察者对象的配置选项中，我们设置了thresholds为1，表示只要有1像素的元素进入视窗，就会触发回调函数。

6、最后，调用ob.observe(el)方法来开始观察指定的元素el。当元素的可见性发生变化时，就会触发回调函数的执行。