实现，一个页面上的两个有垂直滚动条的div，都能够同步地进行自动滚动

为了实现一个页面上的两个垂直滚动条的 div 同步自动滚动，你可以遵循以下步骤：

1. **选择器和引用**：
首先，你需要确定这两个滚动容器的 id 或者 class。例如，假设他们分别是 `scrollContainer1` 和 `scrollContainer2`。

<div id="scrollContainer1">
  <!-- 内容 -->
</div>
<div id="scrollContainer2">
  <!-- 内容 -->
</div>

2. **JavaScript 动态控制**：
使用 JavaScript 来监听滚动事件，并根据事件来同步这两个 div 的滚动位置。这可以通过获取滚动条的位置、改变目标 div 的 scrollTop 属性来实现。

// 获取滚动容器实例
const container1 = document.getElementById('scrollContainer1');
const container2 = document.getElementById('scrollContainer2');

// 监听滚动事件
container1.addEventListener('scroll', () => {
  if (container2.scrollTop !== container1.scrollTop) { // 如果两侧滚动位置不同
    container2.scrollTop = container1.scrollTop; // 设置同步滚动
  }
});

container2.addEventListener('scroll', () => {
  if (container1.scrollTop !== container2.scrollTop) {
    container1.scrollTop = container2.scrollTop; // 同理，双向同步
  }
});

3. **优化性能**：
考虑使用节流（Throttle）或防抖（Debounce）技术来避免频繁地同步滚动导致性能下降。例如，可以每秒只同步一次滚动。

4. **额外考虑**：
- 确保页面内容高度大于滚动容器的高度，否则可能会出现滚动无效的情况。
- 在某些情况下，可能需要处理滚动速度差异，比如鼠标滚轮滚动速度和触屏滑动速度不同。