SOURCE

var ele = document.getElementById('app');
ele.addEventListener('scroll',
function(event) {
  /*
  当滚动整个文档的时候，三个距离获取方式为
  var docHeight = document.body.scrollHeight; // 整个文档的高度
  var scrollY = window.scrollY; // 文档滚动的高度
  var containerHeight = window.innerHeight; // 窗口的高度
  */
  var docHeight = ele.scrollHeight;
  var scrollY = ele.scrollTop;
  var containerHeight = ele.offsetHeight;

  if (docHeight <= scrollY + containerHeight) {
    setTimeout(function() {
      ele.innerHTML = ele.innerHTML + "<div class='item'>new</div>";
    },
    200)
  }
});

<div id="app">
  <div class="item">
    123
  </div>
  <div class="item">
    123
  </div>
  <div class="item">
    123
  </div>
  <div class="item">
    123
  </div>
  <div class="item">
    123
  </div>
  <div class="item">
    123
  </div>
  <div class="item">
    123
  </div>
  <div class="item">
    123
  </div>
</div>

#app {
  width: 240px;
  height: 350px;
  margin: 10px auto;
  border: 1px solid #dadada;
  background: #fff;
  /*  滚动  */
  overflow-y: scroll;
}

.item {
  height: 100px;
  text-align: center;
  line-height: 100px;
  border-bottom: 1px dashed #dadada;
}