offset，client，scroll

三大系列总结：

1. offset系列经常用于获得元素位置 offsetTop offsetLeft

2. client经常用于获取元素大小 clientWidth clientHeight

3. scroll经常用于获取滚动的距离 scrollTop sccrollLeft

offset 翻译过来就是偏移量

Element.offsetParent：返回带有定位的父级元素，如果没有返回body 
Element.offsetTop：返回元素相对带有定位元素上方的偏移 
Element.offsetLeft：返回元素相对带有定位元素上左面的偏移 
Element.offsetWidth：返回自身包括padding，边框，内容区的宽度，返回数值不带单位 
Element.offsetHeight：返回自身包括padding，边框，内容区的宽度，返回数值不带单位

client翻译客户端我们使用client系列属性来获取可视区的相关信息

Element.clientTop：返回上边框的大小 
Element.clientLeft：返回左边框的大小 
Element.clientWidth：返回包括padding，内容区的宽度，不含边框，返回数值不带单位 
Element.clientHeight：返回包括padding，内容区的宽度，不含边框，返回数值不带单位

scroll元素滚动

Element.scrollTop：返回被卷上去的上测距离，返回数值不带单位 
Element.scrollLeft：返回被卷上去的左侧距离，返回数值不带单位

Element.scrollWidth：返回自身的实际宽度，不含边框，返回数值不带单位，盒子里面内容溢出也会计算，用来计算带有滚动条的盒子内容区

Element.scrollHeight：返回自身实际的高度，不含边框，返回数值不带单位，盒子里面内容溢出也会计算，用来计算带有滚动条的盒子内容区

onscroll滚动事件，滚动条滚动就会触发的事件

window.pageYOffset获得整个文档被滚动条卷去的头部 
window.pageXOffset获得整个文档被滚动条卷去的左侧

鼠标的坐标

//client鼠标在可视区的xy坐标 
console.log(event.clientX); 
console.log(event.clientY); 
//page鼠标在页面文档中的坐标ie678不兼容 
console.log(event.pageX); 
console.log(event.pageY); 
//screen得到鼠标在电脑的屏幕坐标 
console.log(event.screenX); 
console.log(event.screenY);