Javascript 如何清除无限滚动中以前的数据

我编写了一个无限卷轴。当用户滚动时，它将加载额外的20个项目，这使得它成为一个长列表

我希望滚动以加载新项目并清除以前的项目

var listElm=document.querySelector（“#无限列表”）；
//添加20个项目。
var-nextItem=1；
var loadMore=函数（）{
对于（变量i=0；i<20；i++）{
var item=document.createElement（'li'）；
item.innerText='item'+nextItem++；
listElm.appendChild（项目）；
}
}
//当滚动到底部时检测。
addEventListener（'scroll'，function（）{
如果（listElm.scrollTop+listElm.clientHeight>=listElm.scrollHeight）{
loadMore（）；
}
});
//最初加载一些项目。
loadMore（）
#无限列表{
/*我们需要限制高度并显示滚动条*/
宽度：200px；
高度：300px；
溢出：自动；
/*可选，仅用于检查它是否适用于边距/填充*/
利润率：30像素；
填充：20px；
边框：10px纯黑；
}
/*下面是可选的眼罩：*/
李{
填充：10px；
列表样式类型：无；
}
李：悬停{
背景：#ccc；
}

如果在此之前清空列表，可以吗


var listElm=document.querySelector（“#无限列表”）；
//添加20个项目。
var-nextItem=1；
var loadMore=函数（）{
listElm.innerHTML=“”
对于（变量i=0；i<20；i++）{
var item=document.createElement（'li'）；
item.innerText='item'+nextItem++；
listElm.appendChild（项目）；
}
}
//当滚动到底部时检测。
addEventListener（'scroll'，function（）{
如果（listElm.scrollTop+listElm.clientHeight>=listElm.scrollHeight）{
loadMore（）；
}
});
//最初加载一些项目。
loadMore（）
#无限列表{
/*我们需要限制高度并显示滚动条*/
宽度：200px；
高度：300px；
溢出：自动；
/*可选，仅用于检查它是否适用于边距/填充*/
利润率：30像素；
填充：20px；
边框：10px纯黑；
}
/*下面是可选的眼罩：*/
李{
填充：10px；
列表样式类型：无；
}
李：悬停{
背景：#ccc；
}

如果在此之前清空列表，可以吗


var listElm=document.querySelector（“#无限列表”）；
//添加20个项目。
var-nextItem=1；
var loadMore=函数（）{
listElm.innerHTML=“”
对于（变量i=0；i<20；i++）{
var item=document.createElement（'li'）；
item.innerText='item'+nextItem++；
listElm.appendChild（项目）；
}
}
//当滚动到底部时检测。
addEventListener（'scroll'，function（）{
如果（listElm.scrollTop+listElm.clientHeight>=listElm.scrollHeight）{
loadMore（）；
}
});
//最初加载一些项目。
loadMore（）
#无限列表{
/*我们需要限制高度并显示滚动条*/
宽度：200px；
高度：300px；
溢出：自动；
/*可选，仅用于检查它是否适用于边距/填充*/
利润率：30像素；
填充：20px；
边框：10px纯黑；
}
/*下面是可选的眼罩：*/
李{
填充：10px；
列表样式类型：无；
}
李：悬停{
背景：#ccc；
}

您可以在每次调用loadMore（）时清空列表

var listElm = document.querySelector('#infinite-list');

// Add 20 items.
var nextItem = 1;
var loadMore = function() {
  //Here we empty the list to remove the old results
  listElm.innerHTML = ''
  //And then load the new items
  for (var i = 0; i < 20; i++) {
    var item = document.createElement('li');
    item.innerText = 'Item ' + nextItem++;
    listElm.appendChild(item);
  }
}

// Detect when scrolled to bottom.
listElm.addEventListener('scroll', function() {
  if (listElm.scrollTop + listElm.clientHeight >= listElm.scrollHeight ) {
    loadMore();
  }
});

// Initially load some items.
loadMore();

var listElm=document.querySelector（“#无限列表”）；
//添加20个项目。
var-nextItem=1；
var loadMore=函数（）{
//在这里，我们清空列表以删除旧结果
listElm.innerHTML=“”
//然后加载新项目
对于（变量i=0；i<20；i++）{
var item=document.createElement（'li'）；
item.innerText='item'+nextItem++；
listElm.appendChild（项目）；
}
}
//当滚动到底部时检测。
addEventListener（'scroll'，function（）{
如果（listElm.scrollTop+listElm.clientHeight>=listElm.scrollHeight）{
loadMore（）；
}
});
//最初加载一些项目。
loadMore（）；
您可以在每次调用loadMore（）时清空列表

var listElm = document.querySelector('#infinite-list');

// Add 20 items.
var nextItem = 1;
var loadMore = function() {
  //Here we empty the list to remove the old results
  listElm.innerHTML = ''
  //And then load the new items
  for (var i = 0; i < 20; i++) {
    var item = document.createElement('li');
    item.innerText = 'Item ' + nextItem++;
    listElm.appendChild(item);
  }
}

// Detect when scrolled to bottom.
listElm.addEventListener('scroll', function() {
  if (listElm.scrollTop + listElm.clientHeight >= listElm.scrollHeight ) {
    loadMore();
  }
});

// Initially load some items.
loadMore();

var listElm=document.querySelector（“#无限列表”）；
//添加20个项目。
var-nextItem=1；
var loadMore=函数（）{
//在这里，我们清空列表以删除旧结果
listElm.innerHTML=“”
//然后加载新项目
对于（变量i=0；i<20；i++）{
var item=document.createElement（'li'）；
item.innerText='item'+nextItem++；
listElm.appendChild（项目）；
}
}
//当滚动到底部时检测。
addEventListener（'scroll'，function（）{
如果（listElm.scrollTop+listElm.clientHeight>=listElm.scrollHeight）{
loadMore（）；
}
});
//最初加载一些项目。
loadMore（）；
当我执行代码时，向下滚动时，项目会不断增加。你能详细说明问题是什么吗？@Fernando我想当我向下滚动列表时，只显示20个项目当应用程序加载新项目时，它必须删除旧项目。你想发生的是，当用户滚动到底部时，旧项目将从列表中删除，只有新项目保留？@FrancoAltuna Yes当我执行代码时，向下滚动时，项目会不断增加。你能详细说明问题是什么吗？@Fernand我想当我向下滚动列表时只显示20个项目当应用程序加载新项目时，它必须删除旧项目。你想发生的是，当用户滚动到底部时，旧项目从列表中删除，只有新项目保留下来？@FrancoAltuna YesThank。但是在你的代码中。当我向下滚动到底部时，它不会加载新项目。我必须上下滚动，谢谢。但是在你的代码中。当我向下滚动到底部时，它不会加载新项目。我必须上下滚动。