clientX,clientY,pageX,pageY,screenX,screenY的区别

1.客户区坐标的位置（clientX,clientY）

所有浏览器支持这两个属性,他们两的值表示事件发生时鼠标的指针在视口中的水平和垂直坐标

2.页面坐标位置（pageX,pageY）

这两个属性表示鼠标在页面中的位置，因此坐标是从页面本身而非视图的左边和顶端计算的，在页面没有滚动的情况下，pageX和pageY 的值与clientX和clientY的值相等

IE8及更早版本不支持事件对象上的页面坐标，不过使用客户区坐标和滚动信息可以计算出来。这个时候需要用到document.body(混合模式)或document.documentElement（标准模式）中的scrollLeft 和scrollTop 属性。计算过程如下：

var pageX=event.pageX, pageY=event.pageY;

if(pageX==undefined)

pageX=event.clientX+(docuemnt.body.scrollLeft||document.document.documentElement.scrollLeft);

if(pageY==undefined)

pageY=event.clientY+(document.body.scrollTop||document.documentElement.scrollTop);

3.屏幕坐标位置（screenX,screenY）

这两个属性可以确定鼠标事件发生时鼠标指针相对于整个屏幕的坐标信息