$.fn.wrapInTag = function(opts) {
var tag = opts.tag || 'strong',
words = opts.words || [],
regex = RegExp(words.join('|'), 'gi'),
replacement = '<' + tag + '>$&</' + tag + '>';
return this.html(function() {
return $(this).text().replace(regex, replacement);
});
};
$('p').wrapInTag({
tag: 'em',
words: ['html', 'CSS', 'JavaScript'],
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<p>O HTML d é muito usado nos dias de hoje, juntamente com o HTML usamos JavaScript e CSS...</p>
Estou tendo problemas com o RegExp no Jquery, eu tenho uma lista de palavras que ele pega do <p> e coloca dentro do <em>. Ele funciona quase que certo, porém ele não respeita palavras inteiras, se eu procuro por HTML ele retorna HTML1, HTMLX, HTMLZ e não só HTML, se o HTML está junto com outras palavras ele identifica a palavra também no meio de outras, ele não respeita uma palavra inteira.
O que eu procuro é que:
- "HTML" fique: HTML
- "HTMLabc" fique intacto, sem ser itálico, somente: HTMLabc;
Meu código de exemplo: http://jsbin.com/zopilefevu/edit?html,js,output
Façam o teste adicionando qualquer letra na frente ou atrás das palavras html, CSS, e JavaScript você poderão ver que ele continua considerando as palavras mesmo tendo outros caracteres juntos no começo ou no final da palavra.