Selection: containsNode() method
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
The Selection.containsNode() method indicates whether a
specified node is part of the selection.
Syntax
containsNode(node)
containsNode(node)
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.
Return value
Returns true if the given node is part of the selection, and false otherwise.
Examples
>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">SECRET</span> could it be?</p>
<p id="win" hidden>You found it!</p>
CSS
#secret {
color: transparent;
}
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
Loading…
See also
Selection, the interface it belongs to.