定义一个scroll容器

javascript

  var data =[1, 2, 3, 4];function render() {document.getElementById('app').innerHTML = '';let tempHtml = ''data.forEach(item => {tempHtml += `  
${item}
`;})app.innerHTML = tempHtml;}window.onload = _ => {console.log(app);render();app.addEventListener('scroll', e => {const { scrollTop: upOverHeight, clientHeight, scrollHeight: allHeight } = app;if (upOverHeight + clientHeight + 10 > allHeight) {console.log('滚动到底')data.push(Math.random())data.push(Math.random())data.push(Math.random())render();}console.log(data)console.warn(app.scrollHeight, app.clientHeight, app.scrollTop);});};

样式

  #app {background-color: #fafafa;width: 500px;height: 500px;overflow: auto;box-shadow: 0 0 8px #aaaaaa;}.block {background-color: white;width: 480px;line-height: 200px;height: 200px;margin: 10px 0;text-align: center;}