Question

i’m using an free Javascript to search and highlight text on a website.
If the search-stirng is part of an word, the hole word should be highlighted.
Example: search for “over”, than “stackoverflow” have to be highlighted.

So the first step is to search the text using regular expressions to select the beginning of the whole word, and return the start-position:

var string='over'; //String to search
var pattern= new RegExp("[a-zA-Záéíóäëiöúàèììùüß-]*"+string,'i');
var position = node.data.toUpperCase().search(pattern);

Next is to call the highlight function….

            if (position >= 0)
                return highlight(node, position, string);
            else
                return 0;

… which used the start position and detects the last character (endbit) of an word

function highlight(node, position, string){
                var middlebit = node.splitText(position);
                var endbit = middlebit.splitText(middlebit.data.search(/[^a-zA-Záéíóäëiöúàèììùüß-]/));
[...] next: highlight the word...

Thats working fine, as long as you NOT use mutated vowel, umlauts and so on.
For example: if you search for over, the whole word “stackoverflow” is highlighted.
If u search for “würstchen” (for example in bratwürstchen) it doesn’t work.
It lookes like, that

 var position = node.data.toUpperCase().search(pattern);

or

var middlebit = node.splitText(position);

Does not work with that kind of special characters.

Hopefully anybody has an idea how to slove that problem.

Thank you so much,

Bndr

Answer 1

In order to answer my own question:
After 2 days of “try-and-error” and finally writing this question, I find an missing “i” at this line:

var endbit = middlebit.splitText(middlebit.data.search(/[^a-zA-Záéíóäëiöúàèììùüß-]/));

there is an wrong expression to find the endbit.
so the right one is:

var endbit = middlebit.splitText(middlebit.data.search(/[^a-zA-Záéíóäëiöúàèììùüß-]/i));

small cause, big impact 😉