上節(jié)講到如何判斷是否滾動到頁面的底部专甩，然后進(jìn)行一系列的操作，這節(jié)講下如何在一個div中一直滾動加載奸鬓，先來看下下面一段代碼：
<!DOCTYPE html><html lang="en">
<head>
<meta charset="UTF-8">
<title>div滾動到底部加載</title>
</head>
<style>
.scrollDiv{
width: 500px;
height: 400px;
margin: 10px auto;
background-color: #ff0000;
overflow-y: scroll;
padding: 10px;
}
</style>
<body>
<div class="scrollDiv" id="testDiv">
<br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/>
</div>
</body>
<script>
var divscroll = document.getElementById('testDiv');
function divScroll() {
var wholeHeight = divscroll.scrollHeight;
var scrollTop = divscroll.scrollTop;
var divHeight = divscroll.clientHeight;
if(scrollTop + divHeight >= wholeHeight){
alert('滾動到底部了！');
//這里寫動態(tài)加載的邏輯谱仪，比如Ajax請求后端返回下一個頁面的內(nèi)容
}
if(scrollTop == 0){
alert('滾動到頭部了玻熙！');
}
}
divscroll.onscroll = divScroll;
</script>
</html>
仔細(xì)看的話，其實和判斷網(wǎng)頁是否滾動到底部是一個道理疯攒。
Paste_Image.png
