addEventListener 的 once 适合什么场景，和手动移除有何不同？
首次点击引导只需运行一回时，addEventListener 的 once 会在回调被调用后自动移除监听器，不管业务是否成功。若组件在首次点击前就关闭，仍要用 signal 或同一函数引用主动清理；一次执行与生命周期结束是两件事。
核心关键词addEventListener once 选项 用法
面试知识索引 · 分类、标签与搜索
事件系统专题面试题，42 道完整答案
事件系统专题面试题第 1 页，显示第 1–42 题，共找到 42 道完整解析，可继续按分类、标签与关键词缩小范围。
42筛选结果
52技术分类
178检索标签
1索引分页
快速定位
清除全部筛选分类、标签与关键词搜索
技术分类52 个
全部分类5000AI Agent511浏览器301JavaScript285React281AI 开发262CSS240Node.js217TypeScript206Vue180前端工程化138React Native135
查看全部 52 个分类
热门标签178 个
查看其余 163 个标签
网络协议111测试109数据库事务95实时通信92Web 可访问性90动画79可观测性77Agent 记忆75向量检索66工具调用66LangGraph59Prompt56任务规划53排障与运维53数据库索引52浏览器自动化51Flexbox50值与类型50GraphQL49事务与并发49构建与镜像49DNS 与 TLS48工程协作与交付48AI 评测47CSS Grid47Express 服务47MCP47副作用与同步47向量与嵌入47文件与多媒体47流与二进制47传输与协议46列表与性能46可维护代码46响应式原理46容器运行46指标日志追踪46数据建模与运维46文件与 I/O46表单与输入46MCP 协议45RAG45Vite 与模块构建45Webpack45内存与虚拟化45原生集成45多 Agent45工作负载与发布45应用与性能45数据处理45模块与工具链45组件与模板45缓存与数据结构45网络与运维45评估与调试45身份认证与授权45运行时与开发45Web 系统方案44一致性与容错44侦听与生命周期44分布式使用44原生组件与交互44可访问交互44消息与异步处理44渲染与调度44索引与执行计划44组件设计44缓存与代理44进程与并发44层叠与选择器43攻击面与防御43文档数据库43权限与安全43离线与渐进增强43语义与文档43请求与通信 API43Worker 与线程协作42存储与离线数据42服务架构42服务端与流式渲染42服务端工程42泛型设计42版本控制42类型收窄42类型运算42组件与端到端42编码与执行42进程与线程42DOM 与文档操作41Flex 布局41HTTP 语义41NestJS 架构41REST 与接口契约41SQL 查询41加载与交互性能41动画与视觉41类型工程41记忆与状态41运行时与调度41Agent 架构40WebAssembly 集成40单元与集成测试40多 Agent 协作40工作流编排40模块与语言机制40浏览器与 UI 自动化40生产运行40函数与作用域39响应式设计39性能与并发39类型系统基础39Grid 布局38数组与集合38盒模型与排版38Hooks 与复用37应用开发37推理与成本37状态共享37知识库数据37模型与应用评测36对象与原型35状态与渲染35语言与并发35异步与 Promise34Effect32RAG 检索31React 性能31响应式与性能31微调与数据31TanStack Query30全栈边界30数据与缓存30大模型基础29路由与数据流29事件循环28流式交互28提示与上下文设计27数据与服务端27组件与依赖注入27组件与响应式27多模态应用24应用与渲染24Hydration22沙箱安全22状态管理18算法18CI/CD13语言与运行时10React Server Components6搜索与排序4实用函数实现3链表栈队列3图算法2字符串算法2树与遍历2索引与高级结构2Kubernetes1作用域与函数1动态规划1异步与浏览器1手写与交互性能1数组与双指针1相等比较1
第 1 页
本页面试问题
按稳定语义路径排序
- 0001
- 0002
哪些场景要把监听器放在捕获阶段？
表单想在子输入框获得焦点时统一记录字段，可以在祖先捕获 focus，或改听会冒泡的 focusin。捕获监听沿祖先向目标运行，适合少量前置观察；它仍受传播路径和更外层监听器影响，清理时也要匹配捕获标志。
核心关键词事件捕获阶段 监听器使用场景 - 0003
click 事件里的 clientX、pageX、screenX 分别从哪里量？
点击图表后把浮层放在指针旁，固定定位通常使用相对视口的 clientX 和 clientY；文档定位要考虑 pageX、pageY，容器内部还需减去自身矩形偏移。screenX 属于屏幕坐标，不能直接套给网页元素，边框与变换也会影响换算。
核心关键词MouseEvent clientX pageX screenX 区别 - 0004
click 和 mousedown、mouseup 的触发时机有什么差别？
保存按钮应在用户完成激活时响应 click，这条路径还覆盖键盘；拖拽画布则要从 pointerdown 或 mousedown 开始记录起点。mousedown、mouseup 与 click 的时机和输入来源不同，不能把 click 当成任意按下加释放的机械组合。
核心关键词click 与 mousedown mouseup 区别 - 0005
getCoalescedEvents 能补回哪些 pointermove 轨迹？
手写笔移动很快时，浏览器可能把多次采样合并为一次 pointermove；getCoalescedEvents 可取回中间点，让轨迹少些折角。它增加的是输入精度，不会提高显示器刷新率；画布坐标、DPR、性能开销和 API 兼容都要另外处理。
核心关键词getCoalescedEvents pointermove 作用 - 0006
怎样拦截 contextmenu 并显示自己的右键菜单？
文件树自定义右键菜单应监听 contextmenu，在事件可取消时阻止原生菜单，再根据指针位置或当前聚焦行定位。键盘也能请求上下文菜单，所以还要给操作项焦点、Escape 关闭和焦点返回路径，并处理视口边缘的遮挡。
核心关键词contextmenu 拦截右键 自定义菜单 - 0007
CustomEvent 的 detail 怎样给组件传数据？
组件选中列表项后，可以用 CustomEvent 的 detail 把记录 ID 发给外部；dispatchEvent 会同步调用监听器。事件默认不冒泡，跨 Shadow DOM 边界还要设置 composed；负载对象按引用传递，事件名与 detail 结构都应作为组件接口维护。
核心关键词CustomEvent detail 传递自定义数据 - 0008
双击时 click 和 dblclick 通常按什么顺序触发？
文件列表双击打开之前，典型鼠标路径已经发生两次 click，浏览器不会替你延后第一次单击。单击若只负责选中，两种动作可以共存；若单击会删除或发请求，就要重新设计互斥策略，还需为键盘和触屏保留独立入口。
核心关键词双击触发鼠标事件顺序 dblclick - 0009
后续监听器怎样知道默认行为已经被取消？
子组件调用 preventDefault 后，父级可通过 defaultPrevented 判断这次事件的默认行为是否已被有效取消；前提是事件可取消且父级读取时子监听已运行。它与 stopPropagation 各管不同事情，也不能直接等同于“所有业务处理都完成”。
核心关键词event.defaultPrevented 判断默认行为 - 0010
动态新增的列表项，为什么一个父级点击监听就够？
待办项由接口不断追加时，在稳定列表父级注册一次 click，再用 closest 找到删除按钮和所属项，新项也能工作。按钮内图标会改变实际 target，contains 可防止匹配越界；若整个父容器被替换，监听仍需重新注册。
核心关键词事件委托 动态添加元素 实现 - 0011
哪些事件不能直接靠冒泡委托？
父级默认委托 click 很直接，但 focus、blur 和 mouseenter、mouseleave 不按普通冒泡路径到达。表单可用 focusin、focusout 或捕获 focus；悬停可用 mouseover、mouseout 并检查 relatedTarget，防止在同一项的子元素之间移动时重复触发。
核心关键词不冒泡事件 事件委托 无法捕获 - 0012
dispatchEvent 是同步的吗，监听器改 DOM 何时可见？
代码调用 dispatchEvent 时，监听器在方法返回前同步执行，所以同步修改的 DOM 下一行就能读到；Promise 与定时器则不会被等待。可取消事件的返回值能表达同步否决，但不能用 async 监听器来等待弹窗确认或服务端校验。
核心关键词dispatchEvent 同步还是异步派发 - 0013
Shadow DOM 里的事件，composed 和 composedPath 各回答什么？
Web Component 内部派发的事件若要到达外部，必须看 composed 是否允许跨影子边界；祖先冒泡监听还需要 bubbles。跨边界后 target 可能重定向为宿主，闭合根的内部路径不会向外暴露；公开业务数据应通过事件 detail 提供。
核心关键词Shadow DOM 事件 composed composedPath - 0014
浏览器会把上一次的 Event 对象复用给下一次点击吗？
同一次事件派发中的父子监听器拿到同一个 Event，但 currentTarget 会随当前监听器改变，异步读取时往往已为空。脚本能在前次派发结束后复用自建事件，不能在派发中重入；每次业务动作新建对象并提前保存 ID、坐标更可靠。
核心关键词事件对象派发 生命周期 复用 - 0015
addEventListener 的 signal 选项如何帮助自动移除监听器？实现 AB 测试或一次性订阅时有用吗？
addEventListener 的 signal 选项如何帮助自动移除监听器？实现 AB 测试或一次性订阅时有用吗？ 本文先给出可直接复述的结论，再用最小代码说明addEventListener signal AbortController的工作方式、判断依据、项目边界和常见误区。
核心关键词addEventListener signal AbortController - 0016
focus 和 blur 事件不冒泡，为何仍能通过事件委托实现，但必须使用捕获？
focus 和 blur 事件不冒泡，为何仍能通过事件委托实现，但必须使用捕获？ 本文先给出可直接复述的结论，再用最小代码说明focus blur 不冒泡 捕获事件委托的工作方式、判断依据、项目边界和常见误区。
核心关键词focus blur 不冒泡 捕获事件委托 - 0017
focusin/focusout 事件与 focus/blur 事件在冒泡行为上有何差异？在表单校验中如何选择？
focusin/focusout 事件与 focus/blur 事件在冒泡行为上有何差异？在表单校验中如何选择？ 本文先给出可直接复述的结论，再用最小代码说明focusin focusout 与 focus blur 区别的工作方式、判断依据、项目边界和常见误区。
核心关键词focusin focusout 与 focus blur 区别 - 0018
KeyboardEvent.key 和 KeyboardEvent.code 分别表示什么？在什么场景下应使用 code 而不是 key？
KeyboardEvent.key 和 KeyboardEvent.code 分别表示什么？在什么场景下应使用 code 而不是 key？ 本文先给出可直接复述的结论，再用最小代码说明KeyboardEvent key 与 code 区别的工作方式、判断依据、项目边界和常见误区。
核心关键词KeyboardEvent key 与 code 区别 - 0019
如何阻止空格键或方向键触发页面滚动，同时保留输入框内的默认行为？
如何阻止空格键或方向键触发页面滚动，同时保留输入框内的默认行为？ 本文先给出可直接复述的结论，再用最小代码说明keydown 阻止空格键方向键页面滚动的工作方式、判断依据、项目边界和常见误区。
核心关键词keydown 阻止空格键方向键页面滚动 - 0020
为网页实现自定义键盘快捷键如 Ctrl+S 保存，如何确保不触发浏览器默认保存？
为网页实现自定义键盘快捷键如 Ctrl+S 保存，如何确保不触发浏览器默认保存？ 本文先给出可直接复述的结论，再用最小代码说明keydown 自定义快捷键 阻止浏览器默认行为的工作方式、判断依据、项目边界和常见误区。
核心关键词keydown 自定义快捷键 阻止浏览器默认行为 - 0021
键盘按住不放时 keydown 事件重复触发，如何利用 event.repeat 属性？
键盘按住不放时 keydown 事件重复触发，如何利用 event.repeat 属性？ 本文先给出可直接复述的结论，再用最小代码说明keydown event.repeat 自动重复触发的工作方式、判断依据、项目边界和常见误区。
核心关键词keydown event.repeat 自动重复触发 - 0022
keydown 事件与已废弃的 keypress 事件有何区别？为什么推荐用 keydown？
keydown 事件与已废弃的 keypress 事件有何区别？为什么推荐用 keydown？ 本文先给出可直接复述的结论，再用最小代码说明keydown 与 keypress 事件区别的工作方式、判断依据、项目边界和常见误区。
核心关键词keydown 与 keypress 事件区别 - 0023
mouseenter 与 mouseover 在冒泡行为和对子元素的触发上有什么区别？
mouseenter 与 mouseover 在冒泡行为和对子元素的触发上有什么区别？ 本文先给出可直接复述的结论，再用最小代码说明mouseenter 与 mouseover 冒泡区别的工作方式、判断依据、项目边界和常见误区。
核心关键词mouseenter 与 mouseover 冒泡区别 - 0024
在 mousedown 事件中，如何区分左键、中键和右键？对应的 button 值是多少？
在 mousedown 事件中，如何区分左键、中键和右键？对应的 button 值是多少？ 本文先给出可直接复述的结论，再用最小代码说明MouseEvent button 区分左键中键右键的工作方式、判断依据、项目边界和常见误区。
核心关键词MouseEvent button 区分左键中键右键 - 0025
mouseleave 事件不冒泡，那么要实现鼠标离开一组子元素的统一处理，可以使用什么替代方案？
mouseleave 事件不冒泡，那么要实现鼠标离开一组子元素的统一处理，可以使用什么替代方案？ 本文先给出可直接复述的结论，再用最小代码说明mouseleave 不冒泡 替代方案的工作方式、判断依据、项目边界和常见误区。
核心关键词mouseleave 不冒泡 替代方案 - 0026
Pointer Events 与 Mouse Events 相比有哪些优势？在处理触摸设备时为何推荐使用前者？
Pointer Events 与 Mouse Events 相比有哪些优势？在处理触摸设备时为何推荐使用前者？ 本文先给出可直接复述的结论，再用最小代码说明Pointer Events 与 Mouse Events 区别的工作方式、判断依据、项目边界和常见误区。
核心关键词Pointer Events 与 Mouse Events 区别 - 0027
在处理单指触摸时，使用 Pointer Events 与 Touch Events 有何区别？哪种更适合跨设备？
在处理单指触摸时，使用 Pointer Events 与 Touch Events 有何区别？哪种更适合跨设备？ 本文先给出可直接复述的结论，再用最小代码说明Pointer Events 与 Touch Events 区别的工作方式、判断依据、项目边界和常见误区。
核心关键词Pointer Events 与 Touch Events 区别 - 0028
哪些情况会触发 pointercancel 事件？实现拖拽时为何需要监听它？
哪些情况会触发 pointercancel 事件？实现拖拽时为何需要监听它？ 本文先给出可直接复述的结论，再用最小代码说明pointercancel 事件触发场景的工作方式、判断依据、项目边界和常见误区。
核心关键词pointercancel 事件触发场景 - 0029
setPointerCapture 有什么作用？何时需要手动释放？给出一个拖拽实现的典型用法。
setPointerCapture 有什么作用？何时需要手动释放？给出一个拖拽实现的典型用法。 本文先给出可直接复述的结论，再用最小代码说明setPointerCapture 拖拽实现 用法的工作方式、判断依据、项目边界和常见误区。
核心关键词setPointerCapture 拖拽实现 用法 - 0030
如何用 preventDefault 阻止滚轮事件引发的页面滚动，但保留自定义滚轮行为？需要注意什么？
如何用 preventDefault 阻止滚轮事件引发的页面滚动，但保留自定义滚轮行为？需要注意什么？ 本文先给出可直接复述的结论，再用最小代码说明wheel 事件 preventDefault 自定义滚动的工作方式、判断依据、项目边界和常见误区。
核心关键词wheel 事件 preventDefault 自定义滚动 - 0031
在 addEventListener 回调中 return false 与调用 preventDefault() 有何区别？
本题解析 addEventListener 回调中 return false 与调用 preventDefault() 的本质区别，说明 return false 仅对 on-event 处理器有效，不适用于 addEventListener，并给出正确实践。
核心关键词addEventListener return false 与 preventDefault 区别 - 0032
DOM 事件传播的三个阶段（捕获、目标、冒泡）分别是什么，监听器在哪个阶段触发？
DOM 事件传播的三个阶段（捕获、目标、冒泡）分别是什么，监听器在哪个阶段触发？ 本文先给出可直接复述的结论，再用最小代码说明DOM 事件传播 捕获 冒泡 阶段的工作方式、判断依据、项目边界和常见误区。
核心关键词DOM 事件传播 捕获 冒泡 阶段 - 0033
同一元素上绑定多个相同类型事件，两个监听器的触发顺序如何保证？
同一元素上绑定多个相同类型事件，两个监听器的触发顺序如何保证？ 本文先给出可直接复述的结论，再用最小代码说明同一元素多个事件监听器触发顺序的工作方式、判断依据、项目边界和常见误区。
核心关键词同一元素多个事件监听器触发顺序 - 0034
scroll 事件本身不冒泡，如何在不给每个滚动容器绑定监听器的情况下统一管理？
scroll 事件本身不冒泡，如何在不给每个滚动容器绑定监听器的情况下统一管理？ 本文先给出可直接复述的结论，再用最小代码说明scroll 事件不冒泡 捕获委托的工作方式、判断依据、项目边界和常见误区。
核心关键词scroll 事件不冒泡 捕获委托 - 0035
scroll 事件触发非常频繁，如何有效地控制处理频率？请对比 rAF、timeout 和 passive 的配合。
scroll 事件触发非常频繁，如何有效地控制处理频率？请对比 rAF、timeout 和 passive 的配合。 本文先给出可直接复述的结论，再用最小代码说明scroll 事件节流 requestAnimationFrame的工作方式、判断依据、项目边界和常见误区。
核心关键词scroll 事件节流 requestAnimationFrame - 0036
scrollend 事件与 scroll 事件有何不同？在处理“停止滚动后执行操作”时如何利用？
scrollend 事件与 scroll 事件有何不同？在处理“停止滚动后执行操作”时如何利用？ 本文先给出可直接复述的结论，再用最小代码说明scrollend 与 scroll 事件区别的工作方式、判断依据、项目边界和常见误区。
核心关键词scrollend 与 scroll 事件区别 - 0037
stopPropagation() 与 stopImmediatePropagation() 的区别是什么？分别在什么场景下使用？
本题对比 stopPropagation() 与 stopImmediatePropagation()：前者允许同元素其他监听器执行完再停止传播，后者立即终止同元素剩余监听器并停止传播，文中给出模拟分发代码、适用场景与失效边界。
核心关键词stopPropagation 与 stopImmediatePropagation 区别 - 0038
如何手动创建并派发一个冒泡的 ClickEvent？有哪些属性需要设置？
如何手动创建并派发一个冒泡的 ClickEvent？有哪些属性需要设置？ 本文先给出可直接复述的结论，再用最小代码说明dispatchEvent 创建派发冒泡事件的工作方式、判断依据、项目边界和常见误区。
核心关键词dispatchEvent 创建派发冒泡事件 - 0039
事件回调中 event.target 与 event.currentTarget 有何区别？在事件委托中应使用哪个？
事件回调中 event.target 与 event.currentTarget 有何区别？在事件委托中应使用哪个？ 本文先给出可直接复述的结论，再用最小代码说明event.target 与 currentTarget 区别的工作方式、判断依据、项目边界和常见误区。
核心关键词event.target 与 currentTarget 区别 - 0040
CSS 属性 touch-action 如何影响 touch 事件的默认行为？与使用 preventDefault 相比有何差异？
CSS 属性 touch-action 如何影响 touch 事件的默认行为？与使用 preventDefault 相比有何差异？ 本文先给出可直接复述的结论，再用最小代码说明touch-action 与 preventDefault 区别的工作方式、判断依据、项目边界和常见误区。
核心关键词touch-action 与 preventDefault 区别 - 0041
TouchEvent 中 touches、targetTouches、changedTouches 三个列表的区别是什么？在 end 事件中应使用哪个？
TouchEvent 中 touches、targetTouches、changedTouches 三个列表的区别是什么？在 end 事件中应使用哪个？ 本文先给出可直接复述的结论，再用最小代码说明touches targetTouches changedTouches 区别的工作方式、判断依据、项目边界和常见误区。
核心关键词touches targetTouches changedTouches 区别 - 0042
什么情况下会触发 touchcancel？在实现自定义滑动手势时为何要处理它？
什么情况下会触发 touchcancel？在实现自定义滑动手势时为何要处理它？ 本文先给出可直接复述的结论，再用最小代码说明touchcancel 事件触发场景的工作方式、判断依据、项目边界和常见误区。
核心关键词touchcancel 事件触发场景