This is an experimental technology
Check the Browser compatibility table carefully before using this in production.
The DocumentOrShadowRoot mixin of the Shadow DOM API provides APIs that are shared between documents and shadow roots — the following features are included in both Document and ShadowRoot.
Properties
DocumentOrShadowRoot.activeElementRead only- Returns the
Elementwithin the shadow tree that has focus. Document.fullscreenElementRead only- The element that's currently in full screen mode for this document.
Document.pointerLockElementRead only- Returns the element set as the target for mouse events while the pointer is locked.
nullif lock is pending, pointer is unlocked, or if the target is in another document. DocumentOrShadowRoot.styleSheetsRead only- Returns a
StyleSheetListofCSSStyleSheetobjects for stylesheets explicitly linked into, or embedded in a document.
Methods
DocumentOrShadowRoot.getSelection()- Returns a
Selectionobject representing the range of text selected by the user, or the current position of the caret. DocumentOrShadowRoot.elementFromPoint()- Returns the topmost element at the specified coordinates.
DocumentOrShadowRoot.elementsFromPoint()- Returns an array of all elements at the specified coordinates.
DocumentOrShadowRoot.caretPositionFromPoint()- Returns a
CaretPositionobject containing the DOM node containing the caret, and caret's character offset within that node.
Specifications
| Specification | Status | Comment |
|---|---|---|
| DOM The definition of 'DocumentOrShadowRoot' in that specification. |
Living Standard | Initial definition. |
| Shadow DOM The definition of 'DocumentOrShadowRoot' in that specification. |
Working Draft | Implementation in Shadow DOM. |
Browser Compatibility
The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.
| Feature | Chrome | Edge | Firefox | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|---|
| Basic support | 53 | Yes | Yes | Yes | 40 | Yes |
activeElement | 53 | Yes | Yes | Yes | 40 | Yes |
styleSheets | 53 | Yes | Yes | Yes | 40 | Yes |
getSelection | 53 | Yes | Yes | Yes | 40 | Yes |
elementFromPoint | 53 | Yes | Yes | Yes | 40 | Yes |
elementsFromPoint | 53 | Yes | Yes | Yes | 40 | Yes |
caretPositionFromPoint | 53 | Yes | Yes | Yes | 40 | Yes |
pointerLockElement | 53 | Yes | Yes | Yes | 40 | Yes |
fullscreenElement | 53 | Yes | Yes | Yes | 40 | Yes |
| Feature | Android webview | Chrome for Android | Edge mobile | Firefox for Android | Opera Android | iOS Safari | Samsung Internet |
|---|---|---|---|---|---|---|---|
| Basic support | 53 | 53 | Yes | Yes | 40 | Yes | ? |
activeElement | 53 | 53 | Yes | Yes | 40 | Yes | ? |
styleSheets | 53 | 53 | Yes | Yes | 40 | Yes | ? |
getSelection | 53 | 53 | Yes | Yes | 40 | Yes | ? |
elementFromPoint | 53 | 53 | Yes | Yes | 40 | Yes | ? |
elementsFromPoint | 53 | 53 | Yes | Yes | 40 | Yes | ? |
caretPositionFromPoint | 53 | 53 | Yes | Yes | 40 | Yes | ? |
pointerLockElement | 53 | 53 | Yes | Yes | 40 | Yes | ? |
fullscreenElement | 53 | 53 | Yes | Yes | 40 | Yes | ? |
[1] This interface's features are still implemented on the Document object.