1. 第一次采用了距离顶部距离的方式来控制上拉加载
$(window).scroll(function () {
        // 滚动条距离顶部的距离 大于 200px时
        if ($(window).scrollTop() >= nowPageNo * (nowPageNo * 100)) {
            console.log('距离大于200')
            console.log(stopPage)
            if (stopPage == true) {
                return;
            } else {
                nowPageNo += 1
                getDataList()
            }
        } else {
            return;
        }
    });

nowPageNo 为当前页码，stopPage为停止请求，当发出请求之后，stopPage应该变更为true，在结果返回之前不应该再次进行请求。
主要利用浏览器滚动时，滚动条距离顶部的距离来判断，一页展现的量是固定的，这个就是需要根据自己的需求来设定不同的距离，以达到刚好的效果。

  1. 采用了浏览器视窗距离固定值来触发上拉加载
$(window).scroll(function () {

            let clientHeight = document.documentElement.clientHeight; //浏览器视口的高度
            let scrollHeight = document.body.scrollHeight; //文档的总高度
            let scrollTop = document.documentElement.scrollTop; //滚动条在Y轴上的滚动距离
            let distance = 50;  //距离视窗还用50的时候，开始触发；

            if (scrollHeight-scrollTop-clientHeight <= distance) {
                console.log('触发加载')
                console.log(stopPage)
                if (stopPage == true) {
                    return;
                } else {
                    pageNo += 1
                    init()
                    stopPage = true
                }
            }
        });

这个思想倒是不难理解 ，总高度去掉滚动距离，去掉视口高度，小于你所设置的距视窗距离，就触发上拉加载。
这种写法倒是比第一种要更好理解一些。

其中存在的问题

笔者在采用这个写法来写H5界面时候，遇到了一个奇怪问题，我在测试这个上拉加载的时候使用的是电脑上浏览器进行测试的，结果是不存在任何问题的，上拉加载很符合要求，并且测试在测试的时候也没有任何问题，然后我们就正常上线啦，没几天就反馈出现了问题。
在安卓手机上，使用微信打开该界面，可以正常滚动，但是不能触发上拉加载，但是使用浏览器打开，也是正常的，同时在ios上也是不存在任何问题。这个问题的产生让我陷入了沉思，mmp，什么玩意？？？？？
在对微信的一通埋怨之后，我又再次着手对其逻辑进行了判断，发现逻辑上应该是没有问题的。那么剩下来的就只有兼容性这个问题啦，明确了方向就只能摸索看看是哪里出现了问题。
能滚动没触发上拉加载，说明进行判断的时候有问题了，于时我直接对这三个值进行逐一判断，是否有值，这么一排查，于是就发现了问题：在微信上打开的界面不能用document.documentElement.scrollTop获取到滚动距离，好家伙，有点东西了。
于时我采用
$(window).scrollTop()

来获取滚动距离，这个时候就没有什么问题了，百度了一下，二者的效果是一样的，$(window).scrollTop()有更好的兼容性。
所以如果有人遇到这样的问题，就不用费心思去想啦
随手点赞，养成好习惯