如何在 JavaScript 中获取和设置滚动条位置142

在 JavaScript 中，我们可以通过以下几种方法来获取和设置滚动条的位置：

获取滚动条位置

1. 和

这两个属性分别返回垂直和水平滚动条当前的位置。
例如：
```javascript
const scrollY = ;
const scrollX = ;
```

2. 和

对于特定元素，我们可以使用这两个属性来获取其内部滚动条的位置。
例如：
```javascript
const element = ("my-element");
const scrollTop = ;
const scrollLeft = ;
```

设置滚动条位置

1. ()

这个方法可以设置窗口的滚动条位置。它接受两个参数：x 和 y 坐标。
例如：
```javascript
(0, 100); // 滚动到页面垂直方向的 100 像素处
```

2. 和

和获取属性一样，这两个属性也可以用来设置元素内部滚动条的位置。
例如：
```javascript
= 100;
= 50;
```

其他相关方法

1. scroll()

这个方法与 () 类似，但它只是滚动窗口一个相对量，而不是绝对位置。
例如：
```javascript
(0, 100); // 向垂直方向滚动 100 像素
```

2. scrollTo()

这个方法与 () 类似，但它接受一个 Element 对象而不是坐标。它还会平滑地滚动到目标元素。
例如：
```javascript
const element = ("my-element");
({ behavior: "smooth" });
```

注意事项* 在某些情况下，使用 () 设置滚动条位置可能会导致页面闪烁或卡顿。
* 对于带有滚动条的元素，滚动条的位置会随着内容的更新而动态改变。
* 在移动设备上，页面滚动行为可能会受到设备本身的设置和功能影响。

2025-02-16

---

上一篇：优雅地刷新网页：Javascript 刷新页面终极指南

下一篇：JavaScript 验证中国身份证号码