原生js获取滚动条在Y轴上的滚动距离，文档的总高度，浏览器视口的

// 滚动条在Y轴上的滚动距离
        function getScrollTop() {
            var scrollTop = 0, bodyScrollTop = 0, documentScrollTop = 0;
            if (document.body) {
                bodyScrollTop = document.body.scrollTop;
            }
            if (document.documentElement) {
                documentScrollTop = document.documentElement.scrollTop;
            }
            scrollTop = (bodyScrollTop - documentScrollTop > 0) ? bodyScrollTop : documentScrollTop;
            return scrollTop;
        }

// 文档的总高度
        function getScrollHeight() {
            var scrollHeight = 0, bodyScrollHeight = 0, documentScrollHeight = 0;
            if (document.body) {
                bodyScrollHeight = document.body.scrollHeight;
            }
            if (document.documentElement) {
                documentScrollHeight = document.documentElement.scrollHeight;
            }
            scrollHeight = (bodyScrollHeight - documentScrollHeight > 0) ? bodyScrollHeight : documentScrollHeight;
            return scrollHeight;
        }

// 浏览器视口的高度
        function getWindowHeight() {
            var windowHeight = 0;
            if (document.compatMode == "CSS1Compat") {
                windowHeight = document.documentElement.clientHeight;
            } else {
                windowHeight = document.body.clientHeight;
            }
            return windowHeight;
        }

//获取元素距离屏幕顶部的距离
 function getElementTop(el) {

            var actualTop = el.offsetTop

            var current = el.offsetParent

            while (current !== null) {

                actualTop += current.offsetTop

                current = current.offsetParent

            }

            return actualTop

        }

domRect = element.getBoundingClientRect();

domRect.top;
domRect.left;
domRect.right;
domRect.bottom;

element-box-diagram.png