ShadowRoot: host property

{{APIRef("Shadow DOM")}}

The host read-only property of the {{domxref("ShadowRoot")}} returns a reference to the DOM element the ShadowRoot is attached to.

Value

A DOM {{domxref('Element')}}.

Examples

const customElem = document.querySelector("my-shadow-dom-element");
const shadow = customElem.shadowRoot;

// …

// return the original host element some time later
const hostElem = shadow.host;

Specifications

{{Specifications}}

Browser compatibility

{{Compat}}

See also

• part and exportparts HTML attributes
• {{HTMLelement("template")}} and {{HTMLElement("slot")}} HTML elements
• {{CSSXref(":host")}}, {{cssxref(":host()")}}, and {{cssxref(":host-context()")}} CSS pseudo-classes
• {{CSSXref("::part")}} and {{CSSXref("::slotted")}} CSS pseudo-elements