一、window下各种视口和坐标
window下常用尺寸属性含义
属性 | 说明 | 备注 |
window.screenWidth、window.screenHeight | 设备屏幕分辨率（包括不可用部分） | |
clientWidth、clientHeight | 获取浏览器可用视口宽高（不含border和边线） | |
offsetWidth、offsetHeight | 获取浏览器可用视口宽高（含border和边线） | |
offsetTop、offsetleft | 获取当前元素到 定位父节点 的top方向的偏移量 | |
scrollWidth、 scrollHeight | 元素内容真实的宽高 | |
innerWidth、innerHeight | 浏览器窗口可视区宽高（不包括浏览器控制台、菜单栏、工具栏）（包含滚动条） | |
scrollTop、scrollLeft | 被滚动遮挡的偏移量 | |
window.screen.availHeight、window.screen.availWidth | 屏幕可用宽高 | |
outerWidth、outerHeight | 整个浏览器的宽高（包括浏览器控制台、菜单栏、工具栏） | |
点击坐标 | ||
clientX、clientY | 点击位置距离当前body可视区域的x，y坐标 | |
pageX、pageY | 对于整个页面来说，包括了被卷去的body部分的长度 | |
screenX、screenY（x、y一样） | 点击位置距离当前电脑屏幕（可用部分）的x，y坐标 | |
offsetX、offsetY | 相对于带有定位的父盒子的x，y坐标 |
二、getBoundingClientRect方法
三、真假判断总结
