当页面中存在一个 position: absolute 且带有半透明背景的 div 覆盖在表格之上时，它会拦截 mousemove 等鼠标事件，导致无法获取其下方的 元素；解决方法是为该遮罩层设置 pointer-events: none，使其完全不参与鼠标事件捕获。
当页面中存在一个 `position: absolute` 且带有半透明背景的 `div` 覆盖在表格之上时，它会拦截 `mousemove` 等鼠标事件，导致无法获取其下方的 `
在 Web 开发中，常需用绝对定位的 div（如高亮蒙版、浮动提示框或视觉装饰层）覆盖表格、网格或其他交互区域。但默认情况下，该 div 会成为鼠标事件的“第一接收者”，即使它完全透明或仅含 alpha 背景，也会阻断 mousemove、click、hover 等事件向其下层 DOM 元素（如 <td>）的传播。<p>✅ 正确解决方案：<br>
为该遮罩 <code>div 添加 CSS 样式 pointer-events: none：
.overlay {
position: absolute;
background: rgba(255, 220, 100, 0.3);
z-index: 1;
pointer-events: none; /* 关键：使鼠标事件穿透 */
}此时，所有鼠标事件将直接“穿过”该元素，交由其下层的表格单元格（或其他目标元素）响应。你原有的 table.addEventListener('mousemove', ...) 或事件委托逻辑无需修改，即可正常通过 event.target.closest('td') 获取当前悬停的单元格。
⚠️ 注意事项：
-
pointer-events: none会使该元素完全忽略所有鼠标交互（包括click、contextmenu、mouseenter等），因此若需在该div上保留部分交互（如拖拽手柄），应采用更精细的方案：例如仅对非交互区域设none，或使用伪元素 +pointer-events: auto配合子元素控制； - 该属性不支持 IE10 及以下版本，如需兼容旧版 IE，可考虑临时移除/隐藏遮罩层再触发事件探测（不推荐，性能与体验较差）；
-
pointer-events对focus、键盘事件无影响，仅作用于指针类事件。
? 扩展技巧：若需在穿透的同时，仍能响应某类事件（如仅允许 click 但不干扰 mousemove），可结合 JavaScript 动态控制——例如监听全局 mousemove 时临时禁用遮罩的 pointer-events，事件处理完毕后恢复；但绝大多数场景下，pointer-events: none 已是最简洁、高效、语义清晰的标准解法。
