element.scrollTop设超大值跨浏览器行为差异，无重排滚动到底部遇问题

别担心，这不是你的操作失误，而是不同浏览器对超出有效范围的scrollTop值的处理逻辑存在差异——本质是CSSOM View规范对这种场景的细节没有强制统一，导致各厂商有不同的实现选择，算不上严格意义上的浏览器Bug。

背后的原因 #

根据CSSOM View规范，scrollTop的有效值应该被限制在0到scrollHeight - clientHeight之间（也就是容器可滚动的最大距离）。但规范并没有明确规定：当开发者设置的数值超出这个范围时，浏览器必须如何处理。这就给了浏览器自由发挥的空间：

• Chrome（及Chromium系浏览器）：会自动将超出上限的数值“钳制”到最大有效值，也就是直接帮你设置成scrollHeight - clientHeight，所以设置超大值会顺利滚到底部，符合直觉。
• Firefox/Safari：它们对超出范围的超大值处理逻辑不同，当数值远大于有效范围时，会出现重置为0的异常行为，这属于它们的实现选择，而非违反规范的Bug。

正确的滚动到底部的方法 #

既然依赖超大值的方式存在跨浏览器兼容问题，最稳妥的做法是直接计算准确的滚动目标值：

// 针对指定容器滚动到底部
const container = document.getElementById('your-container');
container.scrollTop = container.scrollHeight - container.clientHeight;

// 或者使用更现代、可读性更好的scrollTo API，还支持平滑滚动
container.scrollTo({
  top: container.scrollHeight - container.clientHeight,
  behavior: 'auto' // 改成'smooth'即可实现平滑滚动
});

如果是要滚动整个页面窗口，代码类似：

// 滚动整个页面到底部
document.documentElement.scrollTop = document.documentElement.scrollHeight - document.documentElement.clientHeight;
// 或者用scrollTo
window.scrollTo({
  top: document.documentElement.scrollHeight - document.documentElement.clientHeight,
  behavior: 'auto'
});

内容的提问来源于stack exchange，提问作者Banana-In-Black