const divElement = document.getElementById('myDiv');
const scrollTop = divElement.scrollTop; // 获取垂直滚动条位置
const scrollLeft = divElement.scrollLeft; // 获取水平滚动条位置

在获取到当前的滚动条位置后，我们可以通过设置`scrollTop`和`scrollLeft`属性来修改滚动条的位置：

divElement.scrollTop = 100; // 将垂直滚动条位置移动到100px
divElement.scrollLeft = 50; // 将水平滚动条位置移动到50px

3. 平滑滚动效果

为了提升用户体验，我们可以使用平滑滚动效果。我们可以借助CSS的`scroll-behavior`属性来实现：

divElement.style.scrollBehavior = 'smooth';
divElement.scrollTop = 100; // 平滑地滚动到垂直位置100px

通过设置`scroll-behavior`为`smooth`，用户在调整滚动条位置时，会看到一个平滑的滚动效果，减少了突兀感。

4. 监听滚动事件

在实际应用中，我们可能需要监听用户的滚动行为，以便于进行一些动态的操作。以下是监听滚动事件的基本代码：

divElement.addEventListener('scroll', function() {
    console.log('当前滚动位置：', divElement.scrollTop);
});

通过这种方式，我们可以实时获取到

<div id="content" style="height: 200px; overflow-y: auto;">
    <p>这是大量的文本内容...</p>
    <p>这是大量的文本内容...</p>
    <p>这是大量的文本内容...</p>
    <p>这是大量的文本内容...</p>
    <p>这是大量的文本内容...</p>
    <p>这是大量的文本内容...</p>
</div>
<button id="scrollBtn">滚动到底部</button>
<script>
document.getElementById('scrollBtn').addEventListener('click', function() {
    const contentDiv = document.getElementById('content');
    contentDiv.scrollTop = contentDiv.scrollHeight; // 滚动到底部
});
</script>

function addNewContent() {
    const contentDiv = document.getElementById('content');
    const newParagraph = document.createElement('p');
    newParagraph.innerText = '新增内容...';
    contentDiv.appendChild(newParagraph);
    contentDiv.scrollTop = contentDiv.scrollHeight; // 自动滚动到新内容
}