Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/angezid/advanced-mark.js/llms.txt

Use this file to discover all available pages before exploring further.

advanced-mark.js is a high-performance JavaScript library for highlighting arbitrary text, search terms, regular expressions, and character ranges directly in the browser DOM. It extends and significantly improves upon the original mark.js, adding CSS Custom Highlight API support, cross-element matching, shadow DOM and iframe traversal, and much faster performance across large documents.

Introduction

Learn what advanced-mark.js does and how it compares to mark.js

Quickstart

Install the library and highlight your first text in minutes

API Reference

Full reference for mark(), markRegExp(), markRanges(), and unmark()

Guides

Deep dives into filtering, groups, overlapping ranges, and more

​
Key Features

CSS Custom Highlight API

Use native browser highlights via StaticRange/Range objects — no DOM mutations needed

Cross-Element Matching

Find matches that span multiple HTML elements with the acrossElements option

Shadow DOM & iframes

Traverse open shadow roots and same-origin iframes to highlight inside them

Separate Group Highlighting

Highlight individual RegExp capturing groups independently using the d flag

Nesting & Overlapping

Mark nested and overlapping ranges or match groups with wrapAllRanges

jQuery Plugin

Drop-in jQuery plugin build alongside the vanilla JS and ES6 module builds

​
Get Started in Seconds

1

Install via npm

npm install advanced-mark.js
2

Import the library

import Mark from 'advanced-mark.js';
3

Create an instance and highlight

const instance = new Mark(document.querySelector('article'));
instance.mark('lorem ipsum');
4

Style your highlights

mark {
  background-color: yellow;
  color: black;
}

Build docs developers (and LLMs) love

Get started for freeTalk to us