将粗体标签添加到html字符串中

Question

我在javascript / jquery中有一串html。

var str = '<div id="cheese" class="appleSauce"> I like <a href="apple.com"> apple </a> and cheese</div>';

我想把字符串'apple'加粗。所以我这样做：

str = str.replace('apple','<b>apple</b>');

但这打破了字符串的html部分。我明白了：

<div id="cheese" class="<b>apple</b>Sauce"> I like <a href="<b>apple</b>.com"><b>apple</b></a> and cheese</div>

如何在不改变html标记内部匹配的情况下替换html字符串文本中出现的所有字符串？

Answer 1

在这种情况下创建一个元素jQuery元素，并设置innerHTML属性：

var el = $('<div id="cheese" class="appleSauce"> I like apple and cheese</div>');

el.html(el.html().replace('apple','<b>apple</b>'));

Answer 2

var e = $('#cheese');
e.html(e.text().replace('apple','<b>apple</b>'));

Working Fiddle

Answer 3

你可以这样做

var str=str.replace(new RegExp(/(apple)$/),"<b>apple</b>");