clientX, clientY，offsetX, offsetY,screenX, screenY, x, y 的区别是什么？
clientX, clientY是鼠标当前相对于网页的位置，当鼠标位于页面左上角时clientX=0, clientY=0；
offsetX, offsetY是鼠标当前相对于网页中的某一区域的位置，当鼠标位于页面中这一区域的左上角时offsetX=0, offsetY=0；
screenX, screenY是相对于用户显示器的位置
x,y是鼠标当前相对于当前浏览器的位置
分享到：
相关推荐
在JavaScript中，处理鼠标事件时，经常会遇到一系列与鼠标位置相关的属性，如`x`, `offsetX`, `clientX`, `screenX`, `pageX`, `y`, `offsetY`, `clientY`, `screenY`, `pageY`等。这些属性在不同的上下文下提供了...
clientX、clientY、pageX、pageY、screenX、screenY、offsetX、offsetY
`screenX`和`screenY`表示鼠标相对于屏幕左上角的X轴和Y轴的位置。这里的屏幕指的是用户的显示器屏幕。 **特点：** - **屏幕坐标系**：`screenX`和`screenY`是从屏幕的左上角开始计算的。 - **分辨率限制**：`...
4.offsetX，offsetY(鼠标相对于事件源元素的x，y坐标) 元素的offset属性： 1.offsetTop: 元素相对父元素上边的偏移。(只读) 2.offsetLeft： 元素相对父元素左边的偏移。(只读) 3.offsetWidth： 自身包括padding...
4. x 和 y：一般情况下，这两个属性与 clientX、clientY 相似，但有所不同。 二、DOM 对象 DOM 对象提供了多个属性来获取元素的位置、大小等信息。其中包括： 1. offsetTop 和 offsetLeft：获取元素相对于其 ...
在处理鼠标事件时，我们常常会遇到`event.X`和`event.clientX`这两个属性，它们都是用来获取鼠标位置的，但有微妙的差别。 `event.clientX`属性返回的是鼠标指针在浏览器的可视窗口（客户区域）内的X坐标，不包括...
- Firefox不支持offsetX、offsetY以及x、y属性，但是可以通过layerX和layerY属性来替代。 - IE中的x、y属性相当于Firefox和Chrome中的layerX和layerY属性。 - IE7和IE8不支持pageX和pageY属性，而且其document的边界...
clientX 属性用于返回鼠标在窗口客户区域中的 X 坐标。语法：event.clientX 注释：这是个只读属性。这意味着，你只能通过它来得到鼠标的当前位置，却不能用它来更改鼠标的位置。 clientY 属性 clientY 属性用于返回...
* clientX和clientY：事件发生时鼠标相对于浏览器左上角的X/Y坐标 * screenX和screenY：事件发生时鼠标相对于显示器左上角的X/Y坐标 事件对象的方法 事件对象还拥有一些重要的方法，例如： * stopPropagation()：...
clientY属性用于返回鼠标在窗口客户区域中的Y坐标。语法：event.clientY 注释：这是个只读属性。这意味着，你只能通过它来得到鼠标的当前位置，却不能用它来更改鼠标的位置。 6. ctrlKey属性 ctrlKey属性用于检查...
首先要搞明白分清clientY pageY screenY layerY offsetY的区别 作用3（事件对象中记录的鼠标位置） 语法 解释 evt.screenX 相对于屏幕的左上角为原点 evt.screenY evt.clientX 相对于浏览器的客户端左上角为原点...
会通过滚动而改变mouseEvent：（鼠标事件）[ ] offsetX，offsetY：事件属性返回触发事件时，鼠标相对于事件源元素的X，Y坐标，标准事件没有对应的属性clientX，clientY：事件属性返回当事件被触发时鼠标指针相对于...
- **offsetX/offsetY**：这两个属性返回鼠标相对于元素边框的左上角的水平和垂直距离，如果事件发生在body元素上，则与clientX/clientY相同。 - **pageX/pageY**：这两个属性返回鼠标相对于整个页面（包括滚动条）...
2. `event.screenX` 和 `event.screenY`：返回鼠标在屏幕上的绝对坐标，与浏览器窗口无关。 3. `event.offsetX` 和 `event.offsetY`：返回鼠标相对于触发事件的元素（事件源）的可见部分的水平和垂直位置，不包括...
它们的行为与 IE6/7 类似，其中 `event.x` 和 `event.y` 等同于 `event.clientX` 和 `event.clientY`。 4. **Opera**： - Opera 的坐标属性类似于 IE，但同时也支持 `event.pageX` 和 `event.pageY`。 由于 W3C ...
- `offsetX`、`offsetY`：这两个属性提供了鼠标相对于事件源元素的位置坐标，即鼠标在元素内的位置。 - `clientX`、`clientY`：这两个属性返回鼠标相对于浏览器视口（不包括滚动条）的水平和垂直坐标。 - `pageX`、`...
clientX 和 clientY 属性分别返回鼠标指针相对于浏览器窗口客户区域的 X 和 Y 坐标。这是一个只读属性，常用于定位鼠标在页面上的位置，而不改变鼠标指针的位置。 5. ctrlKey ctrlKey 属性用于检测事件触发时，是否...
4. clientX 属性：返回鼠标在窗口客户区域中的 X 坐标，返回一个数字值，表示鼠标的水平坐标。 5. clientY 属性：返回鼠标在窗口客户区域中的 Y 坐标，返回一个数字值，表示鼠标的垂直坐标。 6. ctrlKey 属性：...
在IE中，可以使用x和y属性来达到类似效果，但需要注意的是，如果事件源的父元素设置了`position:relative`等定位属性，x和y可能会返回相对于该父元素的位置。 3. **offsetX 和 offsetY**： 这两个属性表示鼠标相...