markRegExp() method

Syntax

// javascript
const instance = new Mark(context);
instance.markRegExp(regex[, options]);
// jQuery
$(selector).markRegExp(regex[, options]);

Parameters:

regex RegExp - The regular expression. It must have the g flag - the library works with indexes, and only two g and y flags allow setting RegExp lastIndex.

Note that for backward compatibility, RegExp without the g flag is recompiled internally with this flag.
options object - Optional options:

Option	Type	Default	Description
`element`	string	`'mark'`	A custom mark element e.g. `span`.
`className`	string	`''`	A custom class to be added to mark elements.
`exclude`	string or string[]	`[]`	A string or an array of selectors. Specifies DOM elements that should be excluded from searching. See exclude option for more details.
`ignoreGroups`	number	`0`	The number of adjacent capturing groups that should be ignored from the start of RegExp e.g. `/(\w+)(.)(\w+)(?!\2)/g`, `ignoreGroups: 2` - mark the group 3
`separateGroups`	boolean	`false`	Whether to mark RegExp capturing groups instead of whole match See Highlighting separate groups for more details.
`acrossElements`	boolean	`false`	Whether to search for matches across elements See acrossElements option for more details.
`wrapAllRanges`	boolean	`undefined`	Mark nesting/overlapping capturing groups See Marking nesting and overlapping ranges and match groups for more details.
`blockElementsBoundary`	boolean or object	`undefined`	Whether to limit matches within default HTML block elements and/or custom elements See Elements boundaries for more details. `tagNames` string[] - An array of custom HTML tag names `extend` boolean - `true` extends default boundary elements by the custom elements otherwise only the custom elements do have boundaries `char` string - A custom boundary character. The default is `\x01`.
`highlight`	Highlight	`undefined`	If a `Highlight` object is provided, the library switches to using the `CSS Custom Highlight API` instead of wrapping matches in HTML elements See highlight option for more details.
`highlightName`	string	`'advanced-markjs'`	The name of the `Highlight` object necessary to register it using `HighlightRegistry`
`staticRanges`	boolean	`true`	Whether to use `StaticRange` objects instead of `Range` objects (`Highlight` API) See staticRanges option for more details.
`rangeAcrossElements`	boolean	`true`	Whether to create a single `StaticRange/Range` object for matches located across elements (when using the `Highlight` API with `acrossElements` option) See rangeAcrossElements option for more details.
`shadowDOM`	boolean or object	`undefined`	Whether to mark inside shadow DOMs See shadowDOM option for more details.
`iframes`	boolean or object	`false`	Whether to mark inside iframes See iframes option for more details.
`iframesTimeout`	number	`5000` ms	The maximum time to wait for an iframe to load before skipping
`debug`	boolean	`false`	Whether to log messages
`log`	object	`console`	Log messages to a specific object
`filter`	function		A callback to filter matches. It calls for each match (FAE) filter: (nodeOrArray, matchString, matchesSoFar, info) => {} `nodeOrArray` Text or Text[] - The text node which includes the match (TAE) OR an array of text node(s) which include the match if the `Highlight` API is used with `acrossElements` and `rangeAcrossElements` options `matchString` string - The matching string: without `ignoreGroups` and `separateGroups` options - the whole match 2. with `ignoreGroups` option - the match[ignoreGroups+1] group matching string, e.g. `/(-)(\w+)\s+/g`, `ignoreGroups: 1`, the matching string is content of the group 2 3. with `separateGroups` option - the current group matching string `matchesSoFar` number - The number of all matches so far `info` object: `match` array - The result of RegExp exec() method `count` number - The number of matches so far MC `matchStart` boolean - indicate the start of a match AE `groupIndex` number - The current group index SG `abort` boolean - Setting it to `true` breaks the method execution The function must return either `true` (highlight) or `false` (skip highlighting).
`each`	function		A callback for each created element OR `StaticRange/Range` object (`Highlight` API) each: (elementOrRange, info) => {} `elementOrRange` HTMLElement or StaticRange or Range - The marked DOM element OR `StaticRange/Range` object (`Highlight` API) `info` object: `match` array - The result of RegExp exec() method `count` number - The number of matches so far MC `matchStart` boolean - Indicate the start of a match AE `groupIndex` number - The current index of match group SG `groupStart` boolean - Indicate the start of group AE SG `abort` boolean - Setting it to `true` breaks the method execution Note: the `filter` and `each` callbacks are shared the `info` object with updated properties.
`done`	function		A callback on finish. done: (total, totalMatches) => {} `total` number - The total number of created HTML elements OR `StaticRange/Range` objects (`Highlight` API) `totalMatches` number - The total number of highlighted matches
`noMatch`	function		A callback that is called when regex failed to match noMatch: (regex) => {} `regex` string - The stringify RegExp

Example with default options values

const options = {
    element: 'mark',
    className: '',
    exclude: [],
    ignoreGroups: 0,
    acrossElements: false,
    wrapAllRanges: false,
    blockElementsBoundary: false,
    
    staticRanges: true, // Highlight API
    rangeAcrossElements: true, // Highlight API
    shadowDOM: false,
    iframes: false,
    iframesTimeout: 5000,
    filter: (textNode, matchString, matchesSoFar, filterInfo) => {
        return true; // must return either true or false
    },
    each: (markElement, eachInfo) => {},
    done: (totalMarks, totalMatches) => {},
    noMatch: (regex) => {},
    debug: false,
    log: window.console
};

JavaScript:

const instance = new Mark(document.querySelector('selector')),
  regex = /../gi;
instance.markRegExp(regex, options);

jQuery:

$('selector').markRegExp(regex, options);

• AE - only available with the option acrossElements: true

• SG - only available with the option separateGroups: true

• AE SG - only available when with options acrossElements: true and separateGroups: true

• MC - were already wrapped in HTML elements OR for which were created StaticRange/Range objects

• FAE - with the acrossElements option, if the match is located across several elements, it calls for each text node which is part of the match

• TAE - with the acrossElements option can be part of the match