当一个元素出现在视口时添加css样式

假设只需要当元素出现在视口，无论出现多少的话，使用 IntersectionObserver 这个API即可满足需求，代码示例如下：

  // 创建一个 IntersectionObserver 实例
  const observer = new IntersectionObserver(entries => {
    entries.forEach(entry => {
      const isleft = Object.values(entry.target.classList).includes('platform_left')
      if (entry.intersectionRatio > 0) {
        entry.target.classList.add(isleft ? 'animate__slideInLeft' : 'animate__slideInRight');
      }
    });
  });

  // 获取所有需要添加样式的元素
  const leftele = document.querySelectorAll('.platform_left');
  const rightele = document.querySelectorAll('.platform_right');

  // 遍历元素并开始观察
  leftele.forEach(element => {
    observer.observe(element);
  });

  rightele.forEach(element => {
    observer.observe(element);
  });