Giter Club home page Giter Club logo

search-result-keyword-highlighter's Introduction

Search Result Keyword Highlighter

Build Status codecov.io Code Climate Dependency Status devDependency Status

Highlight a keyword in the body of text for a given search result.

Why?

People who use search want to have the word(s) they searched for highlighted in the results. We know this. (because Google does it)

google-search-result-keyword-bold

Google have user-tested every feature of their site/experience...

What?

For a given set of keywords that a person is searching for, we highlight all occurrences of the word in the text of the search results.

Features?

Case-insentive Keyword Highlighting

a search for Java, javA or java will highlight JAVA or JaVa in the search result.

Finds Multiple Occurrences of the Same Keyword in Text

Example:

var text = 'London Bridge is Falling Down FALLING down, fALLiNG Down!';
var highlighted = h('falling', text);
console.log(highlighted);

The resulting highlighted

London Bridge is <b class='highlight'>Falling</b> Down
<b class='highlight'>FALLING</b> down,
<b class='highlight'>fALLiNG</b> Down!

Partial match for Keyword in Text

Imagine you are looking for PHP and someone has listed phpunit in their recent experience, this would be highliged as:

We used <b class='highlight'>php</b>unit for our TDD.

Match Several Distinct Keywords

If you pass in a String which contains multiple keywords, it will be split() into an Array and then each word will be highlighted in the text:

How?

#### Install the module from NPM:

npm install keyword-highlighter --save

Use it in your code:

var highlighter = require('keyword-highlighter');
var text   = 'I write JavaScript Code in Lovely London!';
var result = highlighter('javascript london', text);
console.log(result);

This will output:

I write <b class='highlight'>JavaScript</b>
Code in Lovely <b class='highlight'>London</b>!

Done.




Discussion:

Is it Fast?

Try it! And Judge for yourself!

Should we only sub complete words...?

Consider the following example:

var highlighter = require('keyword-highlighter');
var text = 'She sells sea shells on the sea shore.';
var result = highlighter('she sea', text);
console.log(result);

This will output:

<b class='highlight'>She</b> sells
<b class='highlight'>sea</b> <b class='highlight'>she</b>lls
on the <b class='highlight'>sea</b> shore.

I'm not convinced its useful to highlight she in the string shell ... you? Please discuss

search-result-keyword-highlighter's People

Contributors

nelsonic avatar rjmk avatar simonlab avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.