javascript - 将粗体标签添加到 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>");