shadow DOM events

browser ⟩ web components ⟩ implement ⟩ shadow DOM ⟩ events

⭐️ 重點

• some events are confined to the shadow DOM：like "load".

• others bubble up and out：like "focus", "mouse", "keyboard" events.

when an event that originates in the shadow DOM crosses the boundary and begins to propagate in the light DOM, its target property is changed to the shadow host element, so it appears to have originated directly on that element.

if a web component needs to know when the light DOM content of a shadow DOM has changed, it can register a listener for “slotchanged” events directly on the element.

🔴 主題

• retargeting

• Events that Cross Shadow DOM Boundary

• Bubbling in Shadow DOM

📗 參考

• JS.info ⟩ Shadow DOM & Events

• Google ⟩ The Shadow DOM event model

👥 相關

• slotchange event