Javascript获取鼠标在网页中的坐标

网页可以看作是一个二维平面，页面的各个元素位置布局就是基于这个平面，为了规定页面位置，采用一个二维坐标，页面的左上角为坐标原点，横向向右为X轴，纵向向下为Y坐标。

这个坐标系应用页面元素定位，Javascript作为网页脚本，怎么获取鼠标在网页的相对位置如果鼠标坐标（50px，100px）即表示鼠标在距离页面上部100px，距离页面左端50px。那怎么实时获取鼠标的位置。

1.首先定义两个返回坐标的函数

因为各个浏览器内核定义坐标原点会有些出入，这里用了兼容写法

function pointerX(event){  //x坐标 
  return event.pageX || (event.clientX + (document.documentElement.scrollLeft || document.body.scrollLeft));
}
function pointerY(event){  //y坐标
  return event.pageY || (event.clientY + (document.documentElement.scrollTop || document.body.scrollTop));
}

2.实时获取鼠标坐标写在某一个事件里，这里用鼠标移入事件

元素.onmouseover=function(event){
  pointX=pointerX(event);
  pointY=pointerY(event);
  console.log(pointX);
  console.log(pointY);
}