Selection.containsNode()
Experimental: This is an experimental technology
Check the Browser compatibility table carefully before using this in production.
The Selection.containsNode()
method indicates whether a specfied node is part of the selection.
Syntax
sel.containsNode(node, partialContainment)
Parameters
node
-
The node that is being looked for in the selection.
-
partialContainment
Optional -
When
true
,containsNode()
returnstrue
when a part of the node is part of the selection. Whenfalse
,containsNode()
only returnstrue
when the entire node is part of the selection. If not specified, the default valuefalse
is used.
Example
Check for selection
This snippet checks whether anything inside the body element is selected.
console.log(window.getSelection().containsNode(document.body, true));
Find the hidden word
In this example, a message appears when you select the secret word. It uses addEventListener()
to check for selectionchange
events.
HTML
<p>Can you find the secret word?</p> <p>Hmm, where <span id="secret" style="color:transparent">SECRET</span> could it be?</p> <p id="win" hidden>You found it!</p>
JavaScript
const secret = document.getElementById('secret'); const win = document.getElementById('win'); // Listen for selection changes document.addEventListener('selectionchange', () => { const selection = window.getSelection(); const found = selection.containsNode(secret); win.toggleAttribute('hidden', !found); });
Result
Specifications
Specification |
---|
Selection API # dom-selection-containsnode |
Browser compatibility
Desktop | Mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
Chrome | Edge | Firefox | Internet Explorer | Opera | Safari | WebView Android | Chrome Android | Firefox for Android | Opera Android | Safari on IOS | Samsung Internet | |
containsNode |
1 |
12 |
1
Before Firefox 35, the method didn't throw if
node was null . |
No |
≤12.1 |
3.1 |
1 |
18 |
4
Before Firefox 35, the method didn't throw if
node was null . |
≤12.1 |
2 |
1.0 |
partialContainment_parameter_optional |
Yes |
≤79 |
55 |
No |
Yes |
Yes |
Yes |
Yes |
55 |
Yes |
Yes |
Yes |
See also
-
Selection
, the interface it belongs to.
© 2005–2021 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/Selection/containsNode