js中 clientX/Y、pageX/Y、screenX/Y的区别

  js中 关于鼠标事件(MouseEvent)引出来的坐标问题

    下面我们来挨个介绍常用的坐标,以及它们的含义:

 1.     

var x = e.clientX;  //clientX(clientY)说的是关于
var y = e.clientY;  //当前body可视区域的x,y坐标,与页面是否滚动无关
alert("x:"+x+" y:"+y);

 2.

var x = e.pageX;  //pageX(pageY)说的是关于
var y = e.pageY;  //当前文件(document)的x,y坐标,与页面的滚动有关
alert("x:"+x+" y:"+y);

 3.

var x = e.screenX;  //screenX(screenY)说的是关于
var y = e.screenY;  //当前显示器的x,y坐标,与页面的滚动无关
alert("x:"+x+" y:"+y);

js中 clientX/Y、pageX/Y、screenX/Y的区别

 

上一篇:offsetX/Y、clientX/Y、pageX/Y、screenX/Y


下一篇:clientX和clientY