如何滚动到元素的底部？

Posted 2023-03-31

【中文标题】如何滚动到元素的底部？

【英文标题】：How to scroll to the bottom of an element?

【发布时间】：2021-07-21 15:42:58

【问题描述】：

我试图让页面滚动到元素的底部，但我想使用屏幕底部而不是顶部作为参考。

所有scroll API's我知道只用屏幕顶部作为参考，像这样：

element.scrollTo(
  top: 100,
  left: 100,
  behavior: 'smooth'
);

我有top property，但我想要这样的东西：

element.scrollTo(
  bottom: 100,
  left: 100,
  behavior: 'smooth'
);

当然，这不起作用，这只是一个例子。在这里，我将屏幕底部作为参考，并将其与元素的底部对齐。

有类似的吗？

我知道我可以做offsetTop + element's height（或类似的东西）并将结果用作top value，但我想知道是否有更直接的方法来做到这一点？

【参考方案1】：

你可以试试.scrollIntoView():

element.scrollIntoView(false);

或（相同）：

element.scrollIntoView(block: 'end');

【讨论】：

这是我的第一次尝试，但没有达到我的预期。根据用户的操作，我的组件会被拉伸或收缩，而这个 API 似乎没有遵循它。

@Berg_Durden 好的。据我所知，如果不使用一些高度/偏移参数，就没有其他解决方案。

我明白了。我已经在进行计算，并且运行良好。我会暂时保留它，如果我发现一些东西我可以改变它。无论如何，感谢您的宝贵时间。