Javascript 滚动到改变高度的页面底部

我想使用JS滚动到网页的底部，在线查看，大多数人都说使用JS

window.scrollTo(0,document.body.scrollHeight);

---

然而，当你到达底部时，我想向下滚动的页面会改变其高度（它会不断加载越来越多的页面），所以它的高度不是固定的。最终的高度也会有所不同（因此我无法滚动到页面的最终高度），因此我需要某种滚动方式，直到它确定它已到达底部（它无法再滚动）。

如果您有无限滚动，您实际上需要将其纳入您的设计中。例如，

scrollToBottom

应如下所示：

function scrollToBottom(lastOffset) {
  const offset = document.body.scrollHeight;
  // check if no more scrolling required.
  if (lastOffset === offset)  {
    return;
  }
  // if it is, go to bottom.
  window.scrollTo(0, offset);
  // Now, trigger your `loadMore` logic, whatever it might be, then call scrollToBottom again.
  triggerLoadMore().then(() => scrollToBottom(offset));
  // or triggerLoadMore(() => scrollToBottom(offset));
}

// call this somewhere after your initial load.

现在，

triggerLoadMore

，呃，触发您的loadMore逻辑。我在上面的代码中包含了两个版本，一个是基于承诺的，一个是基于回调的。当它加载了更多内容并将其显示在屏幕上时，它应该回调您的函数（scrollToBottom）。你如何做到这一点，取决于你使用什么，这可能是另一个问题

---

现在，这里有第三个选项，您的触发器是无法直接调用的，因为它与

window.scroll

event或类似逻辑相关联。在这种情况下，您需要在此类函数流的末尾写入此逻辑位—加载更多、在屏幕上渲染、滚动。然后再次触发循环。

@Zlatko答案是最佳性能。但是，您可以在任何上下文中使用此选项：

window.addEventListener( 'resize', function(){
    window.scrollTo(0,document.body.scrollHeight);
});

---

听起来您需要到达页面底部，等待加载并再次滚动到底部。您无法到达页面的结尾，因为您无法知道页面的结尾

function scroll_and_wait(){
  return new Promise(
    function(resolve, reject){
    setTimeout(function(){
    resolve(window.scrollTo(0,document.body.scrollHeight));
    }, 500);})}

 async function scroller(n){while(n>0){await scroll_and_wait();n=n-1;}}

 scroller(5)

调用

scroller

函数将按指定次数滚动到页面底部，暂停500毫秒以加载