js 实现滚动条滑到底部加载数据

首先引入jq，并且后台php查询并输出json数据

$jsonstr=json_encode($list);
echo $jsonstr;

<ul id="list">
</ul>

<script type="text/javascript">
	var pageno=1;
	var isfullload=false;
	 getdata();
	 const contentDiv = document.getElementById('list');
	 //window.onscroll=function(){}
    window.addEventListener('scroll', function() {
	    //盒子可视化高度
	    const  clientHeight = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
	     //盒子的实际高度=隐藏区域+可视区域
	     const scrollHeight=document.body.scrollHeight;
        const scrollTop=$(window).scrollTop();
	    if (scrollTop + clientHeight >= scrollHeight - 10) { // 检查是否滚动到底部（留出10px的余地）
	      getdata(); // 调用加载数据的函数
	    }
	  });
	function getdata(){
		if(isfullload)  return;
		$.get('0327.php',{page:pageno},function(data){
			if(data.length>0 ){
				//alert(data);
				//var arr=JSON.parse(data);
				for(var v of data){
					var str=`<li>`+v['proname']+`</li>`;
					$('#list').append(str);
				}
				pageno++;
			}else{
				console.log('没有更多信息了');
				isfullload=true;
			}

		})
    }

</script>