如何在不限制滾動動畫的情況下在無限滾動上附加元素

Question

我有一個UL，如果用戶滾動超過了給定的閾值，它會在底部動態添加元素。 但是，在創建元素時，然后附加（香草js樣式，即：

container.innerHTML = container.innerHTML + newHtmlString; 

）

但是，這樣做會使滾動跳動，因為我假設像這樣修改DOM會阻止滾動動畫/事件觸發。

滾動事件是這樣附加的：

//scrollableList is a jquery element
this.scrollableList.on('scroll', e => {
    /*
    function that handles checking where 
    scroll position is and appending
    */
 })

有沒有一種方法可以更改/附加到HMTL，從而使滾動保持平穩？

Answer 1

由於不斷調用“滾動”，您正在為瀏覽器性能而努力，這很昂貴。 處理瀏覽器滾動時，請考慮使用debounce功能代替常規的匿名fn。 有關防抖的更多信息，請參見以下已接受的答案 ：

另外，您應該使用el.appendChild而不是el.innerHtml來防止完全重繪DOM，這將節省一些周期。