接下来介绍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
返回垂直位移，单位为像素
通常，这两个值是指相对于父节点的位移
