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 2015年7月.
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 |
浏览器兼容性
Loading…