MouseEvent:clientX 属性
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
MouseEvent
接口的 clientX
只读属性提供了事件发生时应用程序视口内的水平坐标(而不是页面中的坐标)。
例如,单击视口的左边缘时,无论页面是否水平滚动,都会触发一个 clientX
值为 0
的鼠标事件。
值
一个以像素为单位的 double
类型浮点值。
示例
此示例在触发 mousemove
事件时显示鼠标的坐标。
HTML
html
<p>移动鼠标以查看其位置。</p>
<p id="screen-log"></p>
JavaScript
js
let screenLog = document.querySelector("#screen-log");
document.addEventListener("mousemove", logKey);
function logKey(e) {
screenLog.innerText = `
屏幕 X/Y:${e.screenX},${e.screenY}
视口 X/Y:${e.clientX},${e.clientY}`;
}
结果
规范
Specification |
---|
UI Events # dom-mouseevent-clientx |
浏览器兼容性
BCD tables only load in the browser