event.composedpath()是w3c标准方法，返回含shadow dom节点的完整事件路径数组；event.path是非标准私有属性，仅旧版chrome支持，已在chrome 109+移除，现代开发应优先使用composedpath()。
event.path 和 event.composedPath() 都能获取事件经过的节点序列，但适用场景和浏览器支持有差异。现代标准推荐用 composedPath()，它更可靠、符合 Shadow DOM 规范；path 是部分浏览器（如旧版 Chrome）的非标准属性，已逐步弃用。
理解两者的本质区别
event.composedPath() 是 W3C 标准方法，返回一个数组，包含从目标节点开始、沿事件传播路径（捕获 → 目标 → 冒泡）经过的所有节点，**包括跨 Shadow DOM 边界的父级**（前提是事件可穿透）。它始终存在且行为一致。
event.path 是早期 Chromium 实现的私有属性，内容类似但不保证跨浏览器兼容，也不处理 Shadow DOM 的细节，在 Firefox 和 Safari 中通常为 undefined。
如何正确使用 composedPath() 获取完整路径
在任意事件监听器中直接调用即可：
- 对普通 DOM：返回从目标元素到
document（或window）的节点链 - 对含 Shadow DOM 的元素：若事件由 Shadow 内部触发且
bubbles: true，路径会包含 ShadowHost 及其外部祖先 - 注意：只有 冒泡阶段（或捕获阶段）的事件才能拿到完整路径；目标阶段时，路径至少包含目标自身和 document
示例：
button.addEventListener('click', (e) => {
console.log(e.composedPath()); // [button, div#container, body, html, document, window]
});
常见用途与实用技巧
用于精准判断点击是否落在某个区域内部（替代反复 contains()）：
- 检查某元素是否在路径中：
e.composedPath().includes(targetElement) - 查找最近的自定义组件宿主：
e.composedPath().find(node => node.hasAttribute('data-widget')) - 排除特定层级干扰（如点击弹窗遮罩时忽略内部按钮）：
if (!e.composedPath().includes(modalContent)) { closeModal(); }
兼容性与降级方案
如果需支持极老环境（如 Chrome
const path = e.composedPath ? e.composedPath() : (e.path || [e.target]);
但建议优先用标准方法，并通过构建工具（如 Babel + core-js）补全，避免逻辑分支污染主线代码。
