JavaScript Поиск и Выделите текст

Question

Можно создать дубликат:
Implementing a highlight feature for a live search in JavaScript/JQuery

Предположим, у меня есть DIV:

<div id="content">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</div> 

В основном я хочу, чтобы сделать поиск с помощью Javascript, а затем выделите результаты. Итак, предположим, что поисковый запрос magna aliqua. Я делаю следующее:

$("#content:contains('magna aliqua')").addClass("highlight"); 

Это работает, но применяет класс выделения на весь DIV content. Я хочу только выделить точные слова magna aliqua, что означает, что мне как-то придется обернуть текст в тег, а затем применить класс выделения к этому новому тегу.

Каков наилучший способ для этого?

Answer 1

Отличный плагин highlight. Эта вилка поддерживает поиск в регулярном выражении.

http://beatgates.blogspot.com/2011/07/extend-jqueryhighlight-to-highlight.html

Answer 2

Попробуйте это ...

word = 'magna aliqua' 
var rgxp = new RegExp(word, 'g'); 
var repl = '<span class="myClass">' + word + '</span>'; 

var element = $("#content:contains(word)"); 
element.html(element.html().replace(rgxp, repl));