scrollTop获取对象高用法

Question

您好，我想问一下document.body.scrollTop如果想改成获取html中与一个对象的高为100时再显示div应该怎么写呢

<script>
window.onscroll = function() {scrollFunction()};

function scrollFunction() {console.log(121);
    if (document.body.scrollTop > 1000 || document.documentElement.scrollTop > 1000 ) {
        document.getElementById("backtoTop").style.display = "block";
        document.getElementById("mobile-bottom-div").style.display = "flex";
    } else {
        document.getElementById("backtoTop").style.display = "none";
        document.getElementById("mobile-bottom-div").style.display = "none";
    }
}
 
function topFunction() {
    document.body.scrollTop = 0;
    document.documentElement.scrollTop = 0;
}
</script>

Answer 1

获取html中与一个对象的高为100

这是什么操作？看代码应该是滚动到一定高度后显示某个对象并且固定住导航吧？

如果这个高度是根据内容中的某个容器，这个容器滚动到顶部再执行none/block，可以获取容器的位置信息，根据位置信息来判断，类似吸顶效果

<style>
    #backtoTop, #mobile-bottom-div{position:fixed;top:0;left:0}
    #backtoTop{top:40px}
</style>
<div id="backtoTop" style="display:none">Top</div>
<div id="mobile-bottom-div" style="display:none">mobile-bottom-div</div>
<div style="height:300px">
    Block1
</div>
<div style="height:1000px" id="realContent">
    Block2，滚动头到这里显示backtoTop，mobile-bottom-div
</div>
<div style="height:1000px">
    Block3
</div>
<script>
    window.onscroll = function () { scrollFunction() };
    function getTop(el) {
        var t = el.offsetTop;
        while (el = el.offsetParent) t += el.offsetTop;
        return t;
    }
    function scrollFunction() {
        var realContent = getTop(document.getElementById('realContent'));
        if (document.body.scrollTop > realContent || document.documentElement.scrollTop > realContent) {
            document.getElementById("backtoTop").style.display = "block";
            document.getElementById("mobile-bottom-div").style.display = "flex";
        } else {
            document.getElementById("backtoTop").style.display = "none";
            document.getElementById("mobile-bottom-div").style.display = "none";
        }
   }
    function topFunction() {
        document.body.scrollTop = 0;
        document.documentElement.scrollTop = 0;
    }
</script>