如何判断指定dom元素是否在屏幕内

如何判断指定dom元素是否在屏幕内

当dom元素的中心坐标的X及Y坐标均小于显示窗口的顶部，且大于显示窗口的底部坐标时，那么就可以判断该坐标在可见区域。 
首先是窗口的顶部坐标，顶部坐标就是页面的滚动条滚动的距离。 
其次是底部坐标，底部坐标就是滚动条的距离加上当前可视窗口的高度。 
最后dom元素的中心距离，就是这个dom元素到最顶端的高度加上自身高度的除2
var visibleBottom = window.scrollY + document.documentElement.clientHeight;
            //可见区域顶部高度
            var visibleTop = window.scrollY;

            for (var i = 0; i < box.length; i++) {
                var centerY = box[i].offsetTop+(box[i].offsetHeight/2);
                if(centerY>visibleTop&¢erY                     box[i].innerHTML = '区域可见'
                    box[i].setAttribute("class",'box animate')
                    console.log('第'+i+'个区域可见');
                }else{
                    box[i].innerHTML = '';
                    box[i].setAttribute("class",'box')
                    console.log('第'+i+'个区域不可见');
                }
            }。