javascript - 查找特定文本并添加 css

Question

我有这样一段文字:

<li>certain text</li>

现在我想给“文本”部分上色。有了这个我可以找到完整的文本:

$(function() {
    var color = $('*:contains("text")');
    color.css("color", "red");
});

问题是这段代码将完整的文本变成了红色。我如何才能只获得显示“文本”的部分并在该部分做 css？

Answer 1

您需要更改 li 内容，因为浏览器只能将样式应用于元素，而不能应用于文字。

你可以这样做:

$('li:contains("text")').each(function(){
    var licontent = $(this).html();
    licontent = licontent.replace(new RegExp("text", "g"), '<span style="color:red">text</span>');
    $(this).html(licontent);
});

Demonstration

请小心使用 * 选择器。您需要了解它会为您提供 li 的所有父级，包括文档...