返回顶部的通用Js方法

const backTop = (btnId) => {
    let btn = document.getElementById(btnId);
    let d = document.documentElement;
    let b = document.body;
    window.onscroll = set;
    btn.style.display = "none";
    btn.onclick = () => {
        btn.style.display = "none";
        window.onscroll = null;
        this.timer = window.setInterval(() => {
            d.scrollTop -= Math.ceil((d.scrollTop + b.scrollTop) * 0.1);
            b.scrollTop -= Math.ceil((d.scrollTop + b.scrollTop) * 0.1);
            if (d.scrollTop + b.scrollTop == 0)
                window.clearInterval(btn.timer, (window.onscroll = set));
        }, 10);
    };
    let set = () => {
        btn.style.display = d.scrollTop + b.scrollTop > 100 ? "block" : "none";
    }
}
backTop("goTop");

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21

#JavaScript

上次更新: 2024/01/30, 00:35:17

← 简析JavaScript中的事件委托问题非常实用的Js代码工具片段→