Element：滚轮事件Limited availabilityThis feature is not Baseline because it does not work in some of the most widely-used browsers.
Learn moreSee full compatibilityReport feedback滚轮（wheel）事件会在滚动鼠标滚轮或操作其他类似输入设备时触发。
滚轮事件取代了已被弃用的非标准 mousewheel 事件。
备注：
不要将滚轮事件与 scroll 事件混淆。滚轮事件的默认行为是取决于实现的，所以不一定会触发 scroll 事件。即便如此，滚轮事件的 delta* 值也不一定能反映文档内容的实际滚动方向。因此，请不要依赖滚轮事件的 delta* 值来获得滚动方向。请通过检测目标的 scroll 事件的 scrollLeft 和 scrollTop 这两个值代替。
语法在 addEventListener() 方法中使用事件名称，或设置事件处理器属性。
jsaddEventListener("wheel", (event) => {});
onwheel = (event) => {};
事件类型WheelEvent。继承自 Event。
事件属性此接口从父接口：MouseEvent、UIEvent 和 Event 继承属性。
WheelEvent.deltaX 只读
返回一个浮点数（double），表示水平方向的滚动量。
WheelEvent.deltaY 只读
返回一个浮点数（double），表示垂直方向的滚动量。
WheelEvent.deltaZ 只读
返回一个浮点数（double）表示 z 轴方向的滚动量。
WheelEvent.deltaMode 只读
返回一个无符号长整型数（unsigned long），表示 delta* 值滚动量的单位。允许的值为：
常量
值
描述
WheelEvent.DOM_DELTA_PIXEL
0x00
delta* 值以像素为单位。
WheelEvent.DOM_DELTA_LINE
0x01
delta* 值以行为单位。每次鼠标单击都会滚动一行内容，其中行高计算的方法取决于浏览器。
WheelEvent.DOM_DELTA_PAGE
0x02
delta* 值以页为单位。每次鼠标单击都会滚动一页内容。
WheelEvent.wheelDelta 只读
已弃用
返回一个（32 位）整型数，表示像素距离。
WheelEvent.wheelDeltaX 只读
已弃用
返回一个整型数，表示水平滚动量。
WheelEvent.wheelDeltaY 只读
已弃用
返回一个整型数，表示垂直滚动量。
示例通过滚轮缩放元素此示例展示了如何使用鼠标（或其他定点设备）滚轮缩放元素。
html
cssbody {
min-height: 100vh;
margin: 0;
display: flex;
align-items: center;
justify-content: center;
}
div {
width: 105px;
height: 105px;
background: #cdf;
padding: 5px;
}
jsfunction zoom(event) {
event.preventDefault();
scale += event.deltaY * -0.01;
// Restrict scale
scale = Math.min(Math.max(0.125, scale), 4);
// Apply scale transform
el.style.transform = `scale(${scale})`;
}
let scale = 1;
const el = document.querySelector("div");
el.onwheel = zoom;
使用 addEventListener 的等价形式上面的事件处理器也可以通过 addEventListener() 方法来设置：
jsel.addEventListener("wheel", zoom, { passive: false });
规范SpecificationUI Events # event-type-wheelHTML # handler-onwheel浏览器兼容性参见
WheelEvent
Document：wheel 事件