美文网首页
方法封装

方法封装

作者: 前端架构师陈龙威 | 来源:发表于2020-04-02 16:14 被阅读0次

    前言

    本文用于记录常用或好用的方法

    列表

    • 隐藏元素:el.style.display = 'none'

    • 检查元素是否包含指定类:el.classList.contains(className)

    • 元素类的切换:el.classList.toggle(className)

    • 获取当前页面的滚动位置:
      x轴:let x = window.pageXOffset !== undefined? window.pageXOffset : window.scrollLetf;
      y轴:let y = window.pageYOffset !== undefined? window.pageYOffset : window.scrollTop

    • 滚动到顶部:

    const scrollToTop = () => {
        const s = document.documentElement.scrollTop || document.body.scrollTop;
        if (s > 0) {
            // window.requestAnimationFrame() 告诉浏览器——你希望执行一个动画,
            // 并且要求浏览器在下次重绘之前调用指定的回调函数更新动画。该方法需要传入一个回调函数作为参数,
            // 该回调函数会在浏览器下一次重绘之前执行
            // 详细资料:https://developer.mozilla.org/zh-CN/docs/Web/API/Window/requestAnimationFrame
            window.requestAnimationFrame(scrollToTop);
            window.scrollTo(0, c - c/ 8);
        }
    }
    

    相关文章

      网友评论

          本文标题:方法封装

          本文链接:https://www.haomeiwen.com/subject/iuvxphtx.html