1. clientX，pageX，offsetX，screenX的区别：
event.clientX、event.clientY
鼠标相对于浏览器窗口可视区域的X，Y坐标（窗口坐标），可视区域不包括工具栏和滚动条。IE事件和标准事件都定义了这2个属性
event.pageX、event.pageY
类似于event.clientX、event.clientY，但它们使用的是文档坐标而非窗口坐标。这2个属性不是标准属性，但得到了广泛支持。IE事件中没有这2个属性。
event.offsetX、event.offsetY
鼠标相对于事件源元素（srcElement）的X,Y坐标，只有IE事件有这2个属性，标准事件没有对应的属性。
event.screenX、event.screenY
鼠标相对于用户显示器屏幕左上角的X,Y坐标。标准事件和IE事件都定义了这2个属性
------------------------------------------------------------------------------------------------------------------------------
clientLeft,clientTop:表示内容区域的左上角相对于整个元素左上角的位置（包括边框）。(取决于边框的像数值？)
clientWidth,clientHeight:内容区域的宽高，不包括边框宽度值。
offsetLeft,offsetTop:相对于最近的祖先定位元素。
offsetParent:某元素的父元素 例如：this.offsetParent.tagName.toLowerCase() 得到body...
offsetWidth,offsetHeight 整个元素的尺寸(不包括变宽的宽度)
scrollLeft,scrollTop:元素滚动的大小
scrollWidth,scrollHeight:整个内容区域的宽度(包括需拉动滚动条隐藏起来的那些部分) scrollTop+clientWidth
offsetTop：对象相对于版面或由 offsetTop 顶端位置
clientX： 相对文档的水平坐标
clientY： 相对文档的垂直坐标
clientWidth：相对文档的宽度（可见部分的宽度）
clientHeight：相对文档的高度
event.offsetX： 相对容器的水平坐标
event.offsetY ： 相对容器的垂直坐标