我是正则表达式的新手......
我有一个搜索字符串,并且是查询数据库的结果。
在Javascript中如何搜索字符串并强调或加粗它。
让我们说
q="dolor";
result = "Lorem ipsum dolor sit amet, consectetur adipiscing elit, Lorem ipsum dolor sit amet, consectetur adipiscing elit, Lorem ipsum dolor sit amet, consectetur adipiscing elit";
结束字符串应该
Lorem ipsum <em>dolor</em> sit amet, consectetur adipiscing elit, Lorem ipsum <em>dolor</em> sit amet, consectetur adipiscing elit, Lorem ipsum <em>dolor</em> sit amet, consectetur adipiscing elit
答案 0 :(得分:1)
试试这个:
var sentence = "Lorem ipsum dolor sit amet, consectetur adipiscing elit, Lorem ipsum dolor sit amet, consectetur adipiscing elit, Lorem ipsum dolor sit amet, consectetur adipiscing elit";
var match = "dolor";
var replace = "<em>"+match+"</em>";
var regexp = new RegExp(match, "gi");
var output = sentence.replace(regexp, replace);
alert(output);
答案 1 :(得分:1)
我会在您的模式周围使用单词边界\b
,然后进行替换。
var re = new RegExp("\\b" + q + "\\b", "gi");
result = result.replace(re, "<em>" + q + "</em>");
答案 2 :(得分:0)
这里有一个很好的简单函数应该可以解决这个问题,只需将数据库字符串和子字符串传递给此函数,它将返回一个新字符串,其中所有子字符串实例都包含在<em>
个标记中< / p>
function emphasize(str, sub) {
return str.replace(new RegExp(sub, 'g'), '<em>' + sub + '</em>');
}
var str = "Teenage mutant JavaScript ninja. Loves JavaScript",
sub = "JavaScript";
emphasize(str, sub);
=> 'Teenage mutant <em>JavaScript</em> ninja. Loves <em>JavaScript</em>'
答案 3 :(得分:0)
请参阅字符串替换命令,如:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions
中所述 result = result.replace(/(dolor)/g, '<em>$1</em>');
答案 4 :(得分:0)
如果您的搜索字符串不是正则表达式,则可以使用split
并避免转义问题:
result.split(q).join('<em>' + q + '</em>')
顺便说一下, <mark>
可能更合适。
不区分大小写不是那么简单,但我仍然不会使用正则表达式:
function highlight(text, find) {
var lowercaseText = text.toLowerCase();
var lowercaseFind = find.toLowerCase();
var result = '';
var lastIndex = 0;
var i;
while ((i = lowercaseText.indexOf(lowercaseFind, lastIndex)) !== -1) {
result +=
text.substring(lastIndex, i) +
'<em>' + text.substring(i, i + find.length) + '</em>';
lastIndex = i + find.length;
}
return result + text.substring(lastIndex);
}
它也非常适合与DOM合作。