retargeting
browser ⟩ web components ⟩ implement ⟩ shadow DOM ⟩ events ⟩ retarget
- Events that happen in shadow DOM have the host element as the target, when caught outside of the component. 👉 see: tab 1️⃣ 
- Retargeting doesn't occur if the event occurs on a slotted element, that physically lives in the light DOM. 👉 see: tab 2️⃣ 
💾 replit (live demo below on codepen)
- 注意:按在 "Name:" 標籤上時,結果是: 
inner target: <B>
outer target: <USER-CARD>- 按在黃色背景的 "John Smith" 上時 (⭐️ 這是一個 slotted element),結果是: 
inner target: <SPAN>
outer target: <SPAN>Last updated
Was this helpful?