js下滑加载更多内容

let isLoading = false; // 标志位，判断是否正在加载数据
let allDataLoaded = false; // 标志位，判断是否所有数据都已加载完毕

function loadMoreContent() {
  if (isLoading || allDataLoaded) return; // 如果正在加载或所有数据都已加载，则直接返回
  isLoading = true; // 设置加载标志位为true

  // 模拟异步请求数据
  setTimeout(() => {
    const newData = fetchNewData(); // 假设fetchNewData函数用于获取新数据
    if (newData.length === 0) {
      allDataLoaded = true; // 如果没有新数据了，设置所有数据已加载标志位为true
    } else {
      appendDataToDOM(newData); // 假设appendDataToDOM函数用于将新数据添加到DOM中
    }
    isLoading = false; // 数据加载完成，重置加载标志位
  }, 1000); // 模拟1秒的加载延迟
}

window.addEventListener('scroll', () => {
  if (window.innerHeight + window.scrollY >= document.body.offsetHeight - 50) { // 当滚动到距离底部50px时触发加载
    loadMoreContent();
  }
});

// 初始加载一些数据
loadMoreContent();