用JS获取窗口和元素的大小
有时候我们需要获取标签、文本元素和窗口的大小位置,今天我们来看一下。
获取window浏览器的窗口
window.screenX 窗口距离整个屏幕水平方向的位置
window.screenY 窗口距离整个屏幕垂直方向的位置
window.screen.width 整个浏览器的宽度
window.screen.height 整个浏览器的高度
window.screen.availWidth 获取屏幕可用工作区域的宽
window.screen.availHeight 获取屏幕可用工作区域的高,除去任务栏部分,这个高是减去了屏幕底部的状态栏的大小
document.标签名.clientWidth 获取的是标签内容的宽 也就是内容的大小+ 内边距
document.标签名.clientHeight 获取的是标签内容的高 也是内容的大小+ 内边距
document.标签名.offsetWidth 获取的是标签的宽 可以记成 内容 + 内边距 + 边框
document.标签名.offsetHeight 获取的是标签的高 同上面一样内容 + 内边距 + 边框
document.标签名.scrollWidth 获取的是 内容 + 内边距 + 边框 + 外边距 (如果有滚动条再加上滚动条的大小)的宽
document.标签名.scrollHeight 获取的是 内容 + 内边距 + 边框 + 外边距 (如果有滚动条再加上滚动条的大小)的高
document.标签名.scorllLeft 获取的是有事后窗口会卷进屏幕里面遮挡的那部分的大小
document.标签名.scorllTop 获取的是有事后窗口会卷进屏幕里面遮挡的那部分的大小
document.documentElement.clientWidth 获取页面可是窗口区域的宽
document.documentElement.clientHeight 获取页面可是窗口区域的高
window.innerHeight 获取页面可视窗口区域的高
window.innerWidth 获取页面可视窗口的宽