这个问题说明了一切。例如,我有以下HTML代码:
<span id="span">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor<span>
如何更改上面任何单词的颜色而不修改上面的span
(我知道我可以将另一个span
标记添加到id="text"
并使用{ {1}}。但不是这样,我想在标签中搜索单词(可能使用RegExp)并动态更改它的颜色。
答案 0 :(得分:4)
如果不修改范围内容,则无法执行此操作。所以你要么在源代码中执行此操作,要么稍后通过操作DOM(在您的情况下,通过jQuery)来执行此操作。
例如:
var span = $("#span");
span.html(span.html().replace(/dolor/, '<span style="color: red">$&</span>'));
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<span id="span">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor</span>
替换字符串中的$&
是找到的单词。在上面,只会替换第一次出现;要替换多个匹配项,请在正则表达式的末尾添加g
(/dolor/g
)。
请注意,如果您有任何事件处理程序附加到span
中的任何元素,它们将被删除,因为跨度的内容将被删除然后被替换。 (由于你的例子在span
中根本没有任何元素,我认为情况并非如此,但我认为应该提及它。)