<!--原生js-->
1 , 獲取瀏覽器可視區(qū)的寬高
? ? document.documentElement.clientHeight ;
? ? document.documentElement.clientWidth ;
2 , 獲取內(nèi)容區(qū)域可視區(qū)的寬高
? ? 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 , 獲取元素的距離可視區(qū)的距離
? ? <!--包含滾動條的距離-->
? ? obj.offsetLeft/obj.offsetTop
<!--jq-->
1 , 獲取瀏覽器可視區(qū)的寬高
? ? $(window).width()/height() ;
2 , 獲取元素寬高
? ? <!--不包含border和padding-->
? ? $("obj").width()/height() ;
? ? <!--包含padding-->
? ? $('obj').innerWidth()/innerHeight() ;
? ? <!--包含border和padding-->
? ? $('obj').outerWidth([true])/outerHieght([true]) ;
? ? ? ? <!--
? ? ? ? ? ? 當參數(shù)為true的時候 包含margin
? ? ? ? -->
3 , 獲取滾動條的距離
? ? $(window).scrollTop()/$(window).scrollLeft() ;
4 , 獲取元素的偏移
? ? <!--相對于文檔-->
? ? $('obj').offset().left/top ;
? ? ? ? <!--
? ? ? ? ? ? 設(shè)置新的偏移
? ? ? ? ? ? $('obj').offset({
? ? ? ? ? ? ? ? 'left':100,
? ? ? ? ? ? ? ? 'top':200
? ? ? ? ? ? })
? ? ? ? -->
? ? <!--相對于父級-->
? ? $('obj').position().left/top ;
---------------------
作者：未尛
來源：CSDN
原文：https://blog.csdn.net/qq_37956730/article/details/80885344
版權(quán)聲明：本文為博主原創(chuàng)文章，轉(zhuǎn)載請附上博文鏈接！
