Highlight: Highlight() constructor
Baseline 2025Newly available
Since June 2025, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.
The Highlight() constructor returns a newly created
Highlight object which can hold a collection of Range objects to be styled using the CSS Custom Highlight API.
Syntax
js
new Highlight()
new Highlight(range)
new Highlight(range1, range2, /* …, */ rangeN)
Parameters
range1, …,rangeNOptional-
One or more initial
Rangeobjects to add in the new highlight.
Return value
A new Highlight object.
Examples
The example code below demonstrates how to create an empty highlight object, and then add ranges to it:
js
const highlight = new Highlight();
highlight.add(range1);
highlight.add(range2);
The example code below demonstrates how to create a new highlight object and add ranges to it during instantiation:
js
const highlight = new Highlight(range1, range2);
Specifications
| Specification |
|---|
| CSS Custom Highlight API Module Level 1 # dom-highlight-highlight |