Fast Word Highlighting Plugin - jQuery.Highlight.js

Highlight.js is a small, customizable, performant text highlighter that applies custom styles and HTML tags to matched strings or words inside a specific container.

Key features:

• Allows to highlight only entire words.
• Case sensitive.
• Easy to customize the styles of the highlighted strings.

How to use it:

1. Add the jQuery highlight.js plugin after jQuery library.

<script src="https://code.jquery.com/jquery-1.12.4.min.js" 
        integrity="sha384-nvAa0+6Qg9clwYCGGPpDQLVpLNn0fRaROjHqs13t4Ggj3Ez50XnGQqc/r8MhnRDZ" 
        crossorigin="anonymous">
</script>
<script src="jquery.highlight.js"></script>

2. The JavaScript to highlight all the matched text within a specified container or the whole page.

$('.container').highlight('text-to-highlight');

$('body').highlight('text-to-highlight');

3. Apply your own styles to the highlighted text.

.highlight {
  background: #000;
  color: #fff;
  /* more styles here */
}

4. You can also highlight multiple strings at a time.

$('body').highlight('text1 text2');
// or
$('body').highlight(['text1', 'text2']);

5. Enable/disable case sensitive.

$('.container').highlight('text-to-highlight',{
  caseSensitive: true // default false
});

6. Decide whether to highlight only entire words.

$('.container').highlight('text-to-highlight',{
  wordsOnly: true // default false
});

7. Set the word boundary.

$('.container').highlight('text-to-highlight',{
  wordsBoundary: '\\b'
});

8. Specify the highlight element tag and class name.

$('.container').highlight('text-to-highlight',{
  className: 'highlight',
  element: 'span'
});

9. Determine whether to ignore diacritics.

$('.container').highlight('text-to-highlight',{
  ignoreDiacritics: false
});

10. Output all the highlighted text using the callback function.

$('.container').highlight('text-to-highlight', {
  // options here
}, function(el) {
  console.log('Highlighted: ', el)
});

11. Remove default highlight.

$('.container').unhighlight();

Changelog:

v3.5.0 (2021-08-13)

• Add support to ignore diacritics
• Update dependencies
• fix(ie11): normalize does not merge the splitted text.

---

This awesome jQuery plugin is developed by knownasilya. For more Advanced Usages, please check the demo page or visit the official website.