@yi-note/text-highlighter

Fork of TextHighlighter(http://mir3z.github.com/texthighlighter/) in ES6 module

Usage no npm install needed!

<script type="module">
  import yiNoteTextHighlighter from 'https://cdn.skypack.dev/@yi-note/text-highlighter';
</script>

README

TextHighlighter-esm

This is a fork of mir3z/texhighlighter.

What's new

  1. Migrate to ES module system.
  2. Use Rollup as module bundler.
  3. Export in both es module and iife format for browser use.
  4. Publish in npm.

Installation

npm i @yi-note/text-highlighter --save-dev

Getting started

Use ES module

import TextHighlighter from '@yi-note/text-highlighter'

Use IIFE

Add minified script file to head section of your web page, the file can be find in node_modules/@yi-note/text-highlighter/dist/bundle.min.js. Feel free to upload it into CDN or move to the src folder.

Include minified lib file in HTML

<script type="text/javascript" src="bundle.min.js"></script>

How to use

var hltr = new TextHighlighter(document.body);

For more details see API reference or Wiki pages on GitHub.

Development

Install dependencies

npm install

Local dev

npm run dev

Run static pages (index, demos, doc) locally

npm run static

For more informatin, please refer to scripts section in package.json.

Features

  • Highlighting of selected text.
  • Highlighting all occurrences of given text (find & highlight).
  • Removing highlights.
  • Selecting highlight color.
  • Serialization & deserialization.
  • Works well in iframes.
  • Keeps DOM clean.
  • No dependencies. No jQuery or other libraries needed.

Compatibility

Should work in all decent browsers and IE >= 9.

Demos

Documentation

You may check API reference or Wiki pages on GitHub.