getBoundingClientRect 与本元素相关的CSS 边框集合
当计算边界矩形时，会考虑视口区域（或其他可滚动元素）内的滚动操作，也就是说，当滚动位置发生了改变，top和left属性值就会随之立即发生变化（因此，它们的值是相对于视口的，而不是绝对的）。如果不希望属性值随视口变化，那么只要给top、left属性值加上当前的滚动位置（通过window.scrollX和window.scrollY），这样就可以获取与当前的滚动位置无关的常量值。 为了跨浏览器兼容，请使用 window.pageXOffset 和 window.pageYOffset 代替 window.scrollX 和 window.scrollY。不能访问这些属性的脚本可以使用下面的代码：
- left,right,top,bottom,width, height
MouseEvent 接口指用户与指针设备( 如鼠标 )交互时发生的事件
client
- clientX 鼠标指针在点击元素（DOM）中的X坐标。
- clientY 鼠标指针在点击元素（DOM）中的Y坐标。
movement
- movementX 鼠标指针相对于最后mousemove事件位置的X坐标。
- movementY 鼠标指针相对于最后mousemove事件位置的Y坐标。
offset
- offsetX 鼠标指针相对于目标节点内边位置的X坐标
- offsetY 鼠标指针相对于目标节点内边位置的Y坐标
page
- pageX 鼠标指针相对于整个文档的X坐标；
- pageY 鼠标指针相对于整个文档的Y坐标；
screen
- screenX 鼠标指针相对于全局（屏幕）的X坐标；
- screenY 鼠标指针相对于全局（屏幕）的Y坐标；
