JS实现上拉加载

实现鼠标滚轮触底后，隔一秒，在原来的div后添加3个新div

<div class='top'></div>
    <div class='content'>
        <div class='dv'>aaaaaaaa</div>
        <div class='dv'>aaaaaaaa</div>
        <div class='dv'>aaaaaaaa</div>
        <div class='dv'>aaaaaaaa</div>
        <div class='dv'>aaaaaaaa</div>
        <div class='dv'>aaaaaaaa</div>
        <span>加载中...</span>
    </div>

    <script>
        window.onscroll = function () {
        		 //    					窗口可视高度 +  滚轮距滚轮顶部的距离  ==  滚轮的长度
            if (document.documentElement.clientHeight + document.documentElement.scrollTop == document.documentElement.scrollHeight||
            document.body.clientHeight + document.body.scrollTop == document.body.scrollHeight) {
                setTimeout(function () {
                    var dv = document.getElementsByClassName('dv');     //获取原来的dv
                    for (var i = 0; i < 3; i++) {                       //循环出3个新div
                        var newdv = document.createElement('div');      //创建新的节点div
                        newdv.innerHTML = 'aaaaaaaa';                   //新div中的内容
                        newdv.setAttribute('class', 'dv');              //给新div添加class样式
                        dv[dv.length - 1].after(newdv);                 //在最后一个dv后添加新的div
                    }
                }, 1000)				//滚轮触底后隔一秒添加三个新div(模拟调接口时所需时间)
            }
        }
    </script>