接下來介紹JS的各種寬度，坐標位置，相對位移的內容，幫大家也是幫自己理清一下響應的知識點
1.1 屏幕寬高
window.screen.width
返回當前屏幕寬度(分辨率值)
window.screen.height
返回當前屏幕高度(分辨率值)
window.screen.availWidth
返回當前屏幕寬度(空白空間)
window.screen.availHeight
返回當前屏幕高度(空白空間)
1.2 瀏覽器的寬高
outerHeight
包括頁面窗口外面的整個瀏覽器高度
outerWidth
包括頁面窗口外面的整個瀏覽器寬度
1.3 視口的寬高
innerHeight
瀏覽器的窗口的視口的高度（包括滾動條）
innerWidth
瀏覽器的窗口的視口的寬度（包括滾動條）
document.body.clientWidth
document.body.offsetWidth
瀏覽器的窗口的視口的寬度（不包括滾動條）
document.body.clientHeight
document.body.offsetHeight
瀏覽器的窗口的視口的高度（不包括滾動條）
1.4 頁面的寬高
document.body.scrollWidth
頁面內容寬度，包括未顯示在視口需要滾動部分
document.body.scrollHeight
頁面內容高度，包括未顯示在視口需要滾動部分
1.5 元素自身的寬高
Element.offsetWidth
網頁元素的寬度
Element.offsetHeight
網頁元素的高度
2.1 瀏覽器相對屏幕的位移
screenX
瀏覽器左邊界相對于操作系統桌面左邊界的水平位移
screenY
瀏覽器頂部相對于系統桌面頂部的垂直位移
2.2 元素相對視口的位移
Element.getBoundingClientRect().left
網頁元素相對于視口左上角的水平位移
Element.getBoundingClientRect().top
網頁元素相對于視口左上角的垂直位移
2.3 視口相對頁面內容的位移
scrollX
視口左邊界相對于頁面內容左邊界的水平位移
scrollY
視口上邊界相對于頁面內容上邊界的垂直位移
2.4 元素相對頁面內容的位移
Element.getBoundingClientRect().left + scrollX
指定元素左邊界相對于頁面內容左邊界的水平位移
Element.getBoundingClientRect().top + scrollY
指定元素上邊界相對于頁面內容上邊界的垂直位移
2.5 相對于父元素的位移
Element.offsetLeft
返回當前元素左上角相對于Element.offsetParent節點的水平位移
Element.offsetTop
返回垂直位移，單位為像素
通常，這兩個值是指相對于父節點的位移
