js 中的一些位置方法

<!--原生js-->

1 , 获取浏览器可视区的宽高

    document.documentElement.clientHeight ;

    document.documentElement.clientWidth ;

2 , 获取内容区域可视区的宽高

    document.body.clientWidth/offsetWidth ;

    document.body.clientHeight/offsetHeight ;

3 , 获取元素的宽高

    <!--包含border+pdding-->

    obj.offsetWidth/obj.offstHeight ;

    <!--包含padding-->

    obj.clientWidth/obj.clinetHeight ;

    <!--不包含border和padding-->

    window.getComputedStyle('div').width/height ;

4 , 获取滚动条的距离

    document.documentElement.scrollTop

    document.documentElement.scrollLeft

5 , 获取元素的距离可视区的距离

    <!--包含滚动条的距离-->

    obj.offsetLeft/obj.offsetTop

<!--jq-->

1 , 获取浏览器可视区的宽高

    $(window).width()/height() ;

2 , 获取元素宽高

    <!--不包含border和padding-->

    $("obj").width()/height() ;

    <!--包含padding-->

    $('obj').innerWidth()/innerHeight() ;

    <!--包含border和padding-->

    $('obj').outerWidth([true])/outerHieght([true]) ;

        <!--

            当参数为true的时候 包含margin

        -->

3 , 获取滚动条的距离

    $(window).scrollTop()/$(window).scrollLeft() ;

4 , 获取元素的偏移

    <!--相对于文档-->

    $('obj').offset().left/top ;

        <!--

            设置新的偏移

            $('obj').offset({

                'left':100,

                'top':200

            })

        -->

    <!--相对于父级-->

    $('obj').position().left/top ;

---------------------

作者：未尛

来源：CSDN

原文：https://blog.csdn.net/qq_37956730/article/details/80885344

版权声明：本文为博主原创文章，转载请附上博文链接！