markdown JavaScript的片段

Posted 2021-05-06

# JavaScript代码片段

## 区域滚动延迟加载图片
```javascript
function show(){
    var showId = document.getElementById("target");
    var client = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
    var targetTop = showId.getBoundingClientRect().top;
    if(targetTop <= client){
        //图片加载
    }
}
window.onscroll = show();
```

## 判断网页滚动到底部和顶部
```javascript
function scrollBottomOrTop(){
    var client = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
    var scrollTop = document.body.scrollTop;
    var wholeHeight = document.body.scrollHeight;
    if(client+scrollTop >= wholeHeight){
        alert("已经滚动到底部");
        //ajax加载
    }
    if(scrollTop==0){
        alert("已经滚动到顶部");
    }
}
window.onscroll = scrollBottomOrTop();
```

## 判断DIV块加载到底部或顶部
```javascript
var divScroll = document.getElementById("target");
function DivScroll(){
    var wholeHeight = divScroll.scrollHeight;
    var scrollTop = divScroll.scrollTop;
    var divHeight = divScroll.clientHeight;
    if(scrollTop+divHeight >= wholeHeight){
        alert("DIV滚动到底部了");
    }
    if(scrollTop==0){
        alert("DIV滚动到顶部了");
    }
}
divScroll.onscroll = DivScroll;
```