1

我需要将颜色应用于 html 元素,但仅限于内容的特定部分。

目前我用一个名为matchedOn的类标记每个,并使用以下Jquery来执行必要的着色:

$('.matchedOn:contains("' + matchedItem + '")').css({ "color": "#008000", "background-color": "#FFFF00" });

matchItem 是来自 Ajax 提要的变量。好的,所以这适用于完整的条目,所以如果显示的文本<dd><dd>Hello there this is a test string</dd>并且在上面的示例中,matchedItem 是'this is',我怎么能只将颜色属性分配给 just 'this is'

4

2 回答 2

3

所有样式处理都需要包含在一个标签中,因此请<span class='highlight'>在此文本周围加上 a 并highlight在样式表中添加一个声明。

使用 jQuery 找到元素后,您需要替换.html()元素内的文本以将 span 环绕在文本周围。

var match = $('.matchedOn:contains("' + matchedItem + '")')
$(match).html($(match).html().replace(matchedItem,"<span class='highlight'>"+matchedItem+"</span>")); 
于 2013-10-22T15:04:21.033 回答
1

这里有一个 JQuery 插件:JavaScript text higlighting jQuery plugin

您可以编写自己的方法来包装文本,但我相信这将是一个更快的解决方案。

于 2013-10-22T15:08:57.777 回答