通过document.documentElement获取html
通过document.body获取body
window.screen === screen
DOM对象的属性
clientHeight:页面中看到的区域的高度,包括padding,不包括滚动条高度、边线
offsetHeight:页面中看到的区域的高度,包括padding、滚动条高度、边线
scrollHeight:内容的全文高度, 包括padding,不包括滚动条高度、边线
clientTop:元素内部上边沿距离元素本身上边沿的距离,即border-top的宽度
offsetTop:元素本身上边沿距离document上边沿的距离
scrollTop:元素滚动的纵向距离
window的属性
innerHeight:浏览器窗口中可以看见的内容的高度,包括滚动条;
outerHeight:整个浏览器的高度
pageYOffset:页面纵向滚动的距离,兼容性更好
// 距离页面顶部的距离,优先使用pageYOffset
let scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop
scrollY:同pageYOffset,但是可以赋值,让视图滚动到指定位置
screenTop(screenY):浏览器上边沿距离屏幕顶部的距离
screen的属性
availHeight:屏幕可用区域的高度,即减去任务栏的高度
height:屏幕的高度
event事件中鼠标的位置
offsetX: 鼠标点击位置与该元素内部左边沿的距离 ,不包括border
clientX:鼠标点击位置与窗口左边沿的距离
pageX:鼠标点击位置与document左边沿的距离,包括横向滚动距离
screenX:鼠标点击位置与屏幕左边沿的距离