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.
-
partialContainmentOptional -
When
true,containsNode()returnstruewhen a part of the node is part of the selection. Whenfalse,containsNode()only returnstruewhen the entire node is part of the selection. If not specified, the default valuefalseis 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