如何用 event.composedPath 获取事件触发经过的所有节点

event.composedPath()用于获取事件在Shadow DOM中的完整传播路径，返回从目标节点到根节点的数组；适用于Web Components中跨Shadow边界精准判断事件来源或委托。event.composedPath() 是一个用于获取事件在 Shadow DOM 中传播路径的方法，它返回一个包含事件经过的所有节点（包括 Shadow DOM 内部节点）的数组，从最内层目标节点开始，一直到根节点（通常是 document 或 shadowRoot 的宿主元素）。什么时候需要使用 composedPath()当你的页面使用了 Web Components（尤其是带 Shadow DOM 的自定义元素），且事件从 Shadow DOM 内部触发、冒泡到外部 DOM 时，普通 event.path（非标准）或 event.target/event.currentTarget 可能无法反映完整路径——因为 Shadow DOM 有“穿透边界”的限制。而 composedPath() 是标准方法，能准确还原事件真实经过的全部节点链。例如：点击一个封装在 Shadow DOM 中的按钮，想判断它是否位于某个特定自定义组件内部，或是否经过某类容器，就需要这个路径。基本用法和返回结构调用方式很简单：element.addEventListener('click', (e) => { const path = e.composedPath(); console.log(path); // [button, #shadow-root, my-card, body, html, document]});返回数组顺序是：从事件目标开始，逐级向上直到根。注意： 文心快码 文心快码（Comate）是百度推出的一款AI辅助编程工具