Как найти определенный текст с jQuery и стиль их

Question

Я смутился, и мне нужна ваша помощь, как? Если

<pre>Lorem Ipsum Dolor Sir amet</pre> 

и я хочу, чтобы текст «ipsum» окрашен в желтый цвет.

Answer 1

Запустите небольшую функцию замены, чтобы программно изолировать ваше целевое слово, в данном случае второе слово. Вы также можете подменить это значение для жесткого кодирования, если вы всегда знаете, какое слово вы нацеливаете.

HTML

<pre>Lorem Ipsum Dolor Sir amet</pre> 

CSS

span { background: yellow; } 

JQuery

$('pre').html(function(i, word) { 
    return word.replace(/\s(.*?)\s/, ' <span>$1</span> '); 
}); 

Codepen example

Answer 2

Попробуйте создать тег span и wrap ваш контент в этом.

$('pre:contains(Ipsum)').each(function(){ 
    $(this).html(
    $(this).html().replace('Ipsum ','<span class="colorClass"> Ipsum </span>') 
); 
}); 

Working Demo

Answer 3

вы не можете выделить текстовый узел, необходимо обернуть его в другой элемент, как span затем использовать его, чтобы применить Изюминкой

$('pre').html(function(idx, html){ 
    return html.replace(/(Ipsum)/, '<span class="highlight">$1</span>') 
}) 

Демо: Fiddle