这是我参与「第五届青训营 」伴学笔记创作活动的第 11 天
事件对象：事件函数的第一个形参，就是事件对象 存储着和当前这一个事件相关的一些信息
事件触发的时候数据到可视区的距离：
clientX （横轴） clientY（纵轴） 可视区：看到的网页的高度宽度
事件触发的时候鼠标到文档的距离：
pageX（横轴） pageY（纵轴） 文档：整个网页高度宽度
事件触发的时候鼠标到元素本身的距离：
offsetX（横轴） offsetY（纵轴）
获得到定位父级之间的距离（与定位并用）：
offsetLeft（左边） offsetRight（右边）offsetTop（上边） offsetBottom（下边）
事件触发的时候鼠标到用户屏幕的距离：
screenX（横轴） screenY（纵轴）
获取页面大小：
window.innerWidth / window.innerHeight（浏览器窗口区域的大小）
window.outWidth / window.outHeight
获得窗口滚动距离：
window.pageXOffset window.pageYOffset
浏览器在距离显示屏左上角中的位置：
window.screenX / window.screenY
window.screenLeft / window.screenTop
对象存储显示器相关的信息：
screen.height / screen.width 用户屏幕大小
获取元素边框大小（border）：
clientLeft clientTop
获取content+padding：
clientWidth clientHeight
获取当前元素距离最近一个定位父级元素的坐标（postion+margin）：
offsetLeft offsetTop
获取当前的可视区域（padding+width+border）：
offsetHeight offsetWidth
获取距离最近的定位元素（父级）：
offsetParent
页面滚动位置：
document.documentElement.scrollTop （document.body.scrollTop）
元素滚动位置：
ele.scrollTop / ele.scrollLeft parent.scrollTop
元素大小的获取：
scrollHeight / scrollWidth（元素的实际高度包含超出内容的区域）
元素位置获取的api：
ele.getBoundingClientRect() ：返回一个对象，包含该元素的位置相关信息
窗口位置x，y位置出现的元素：
document.elementFormPoint(x,y)
事件指的是用户与页面文档的交互行
js中的事件三类：
1.鼠标事件
2.键盘事件
3.浏览器事件：可以通过js监听到用户的鼠标行为和键盘行为，以及控制浏览器的行为
事件的书写方式：
ele.事件句柄（添加的事件类型）=事件处理函数 节点.事件 = 函数。
ele元素与用户出发了某个事件以后，需要执行对应的时间处理函数
1.事件处理函数不会自动执行，需要触发了事件句柄的条件才会执行
2.this永远指向触发该事件的元素
重要的几个事件： （鼠标事件）
onclick 左键单击
ondblclick 左键双击
onmouseover onmouseenter 鼠标移入
onmouseout onmouseleave鼠标移出
onmousedown 鼠标按下
onmousemove 鼠标移动
onmouseup 鼠标抬起
oncontextmenu 右键单击
（键盘事件）
1.onkeydown onkeypress 键按下
2.onkeyup 键抬起
（系统事件）
1.onload 加载完成后
2.onerror 加载出错后
3.onresize 窗口调整大小时
4.onscroll 滚动时
（表单事件）
1.onfocus 获取焦点后
2.onblur 失去焦点后
3.onchange 改变内容后
4.onreset 重置后
5.onselect 选择后
6.onsubmit 提交后
