如何使用jquery以黄色突出显示字符串的特定部分[重复]答案

【问题标题】：How to highlight in yellow a specific part of a string using jquery [duplicate]如何使用jquery以黄色突出显示字符串的特定部分[重复]
【发布时间】：2017-01-13 12:03:15
【问题描述】：

我想知道如何使用 jQuery 仅用黄色突出显示字符串的加号 (+)。

例如：
文字：Lorem ipsum dolor sit amet, consectetur adipiscing elit +

【问题讨论】：

看看mark.js，它就是为这种方法而构建的

标签： javascript jquery

【解决方案1】：

嗯，我想这是最简单的方法。只需使用span 标签并附上您想要更改的任何内容。给它一个id。最后使用 id 更改 css 属性。

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
$(document).ready(function(){
   $("#colouring").css("color","yellow");
});
</script>
</head>
<body>

<p>

Lorem ipsum dolor sit amet, consectetur adipiscing elit <span id="colouring">+</span>
</p>

</body>
</html>

【讨论】：

您好，感谢您的建议。是的，这是更好的方法。问题是代码将从旧的 CMS 生成，我无法按照您的建议添加类或 ID。
那就不要使用jquery了。 <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit <span style="color:yellow">+</span> </p>

【解决方案2】：

您可以替换字符串的特定部分并将其换行。为了更好地处理，您应该使用类和 css 来突出显示某些部分。

var text = $('#myspan').text();
text = text.replace('+', '<span style="color: yellow;">+</span>');
$('#myspan').html(text)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<span id="myspan">Lorem ipsum dolor sit amet, consectetur adipiscing elit +</span>

【讨论】：

innerHTML 是邪恶的，它会破坏 DOM 事件并触发 DOM 的再生！
你必须知道，你在做什么：\