如何更好的理解（pageX,pageY,clientX,clientY,eventX,eventY,scrollX,scrollY,screenX,screenY,event.offsetX,event.offsetY，offsetLeft,style.left）

1 pageX,pageY:鼠标指针相对于当前窗口的X,Y坐标，计算区域包括窗口自身的控件和滚动条。（火狐特有）

2 event.clientX,event.clientY:鼠标指针相对于当前窗口的X,Y坐标,和page 不同的是计算区域不包括窗口自身的控件和滚动条。

3 event.X和event.Y:相对于当前窗口，设置或获取鼠标指针位置相对于父文档的x,y像素坐标(可惜火狐不支持，人生总要有些遗憾也是没办法的)。

4 scrollX,scrollY：望文生义，相对于浏览器而言的，随滚动条移动而变化。

5 screenX,screenY：事件发生时鼠标指针相对于屏幕的水平坐标和竖坐标(屏幕左上角的位置)（这个可是跟屏幕大小有关系的啦，不过IE不支持该属性，只读属性）

6 针对5呢，IE是用screenLeft和screenTop（等于screenY+工具栏+地址栏的像素）。话到嘴边了，再说一下innerwidth innerHeight吧，嘿嘿，他两是窗口文档显示区域的宽度，不包括边框和滚动条，该属性可读可写。

7 event.offsetX,event.offsetY：设置或获取鼠标指针位置相对于触发事件的对象的 x 坐标。 （触发事件的元素,ie,chrome支持此属性，火狐不支持）

8 offsetLeft:值得注意的是该属性并非事件对象的属性，他是DOM对象所有的，获取的是相对于父对象的左边距。该属性表示的是DOM对象在“该DOM对象的层级关系中离该对象最近的，设置了position的父对象”中的位置，虽然话是这么说的，但是不同的浏览器效果不一样，FF中严格按上述说明执行，但是在IE6/7中，这个属性返回该DOM对象在其直接父对象中的位置，但是IE8改正了这个问题，不过IE8又有了一个新问题，其他的浏览器都是从父对象的内容区域的左上角开始定位，IE8确是从父元素的border的左上角开始定位，由于测试环境为IETester中的IE8，不能排除是IETester的问题。

9 style.left:获取的是相对于具有定位属性(position定义为relative)的父对象的左边距。

10 9是读写的，8是只读的，所以要想改变div的位置，只能修改style.left.并且9的值需要在html里预先定义。8则无需事先定义div的位置

先写到这里吧~欢迎大家吐槽纠正以及补充~