JS replace 正则：求大神进来看一看，弄了一下午了没弄出来

悬赏园豆：100 [已解决问题] 解决于 2015-07-10 16:03

原始字符串 var sourceText="";

sourceText有很多种情况。比如：

情况1： sourceText="Where there is great love, there are always miracles.";

情况2：sourceText="Where there is great love, there

are always miracles.";

情况3：...

需要处理的字符串：there are always

现在的需求是：从原始字符串中找到需要处理的字符串，然后高亮加黄色背景显示。但是原始字符串里可能所有的单词都已经被加粗和加字体颜色，这样直接找"there are always"这个字符串是找不到的。需要处理的字符串可能是一个单词，也可能是一个句子。

以sourceText为情况2和需要处理的字符串是there are always举例，需要得到的结果是：Where there is great love, there

are always miracles.

跪求大神不吝赐教！！！

能帮忙写出code最佳！！！

一下午没弄出来，实在是没招了！！！

在线等,

Help me...

javascript 正则表达式

GEEKc | 初学一级 | 园豆：39
提问于：2015-07-09 16:11

< >

最佳答案

哈哈，用大叔那一招来说就是，一个个的抓出来，严刑拷打。

收获园豆：40

请叫我头头哥 | 大侠五级 |园豆：9382 | 2015-07-10 11:10

头头哥，你可以帮忙给一个小的demo吗？

在线等，大神，多谢了。

GEEKc | 园豆：39 (初学一级) | 2015-07-10 13:47

@GEEKc:

　　　　 // sourceText=原始字符串, matchText=需要处理的字符串
        function GetHightLight(sourceText, matchText)
        {
            var matchSyntax = "(<span[^>]*>)*" + matchText.split(" ").join("\\s*(<\/span>)*\\s*(<span[^>]*>)*") + "\\s*(<\/span>)*\\s*";
            var reg = new RegExp("(" + matchSyntax + ")", "gi");
            sourceText = sourceText.replace(reg, "<span style='background-color:yellow;font-weight:inherit;'>$1</span>")
            return sourceText;
        }

你可以试试上面这个代码，我在本地已经测试了，没有问题。

你看看在你那可以不，如果有问题就继续追问吧！

请叫我头头哥 | 园豆：9382 (大侠五级) | 2015-07-10 15:25

@请叫我头头哥: 测试通过。多谢

GEEKc | 园豆：39 (初学一级) | 2015-07-10 15:58

@请叫我头头哥: 强！！！

幻天芒 | 园豆：37207 (高人七级) | 2015-07-10 16:28

@幻天芒: 哈哈，其实正则不难，就是绕而已，得慢慢拼慢慢测。麻烦了点。

请叫我头头哥 | 园豆：9382 (大侠五级) | 2015-07-10 16:29

@请叫我头头哥: 我能说，我每次都要去翻文档么。记不住那些符号。

幻天芒 | 园豆：37207 (高人七级) | 2015-07-10 16:31

@幻天芒: 同感，我也记不住，要不翻文档，有个10天半个月没用正则，再让用就玩完。

请叫我头头哥 | 园豆：9382 (大侠五级) | 2015-07-10 16:38

其他回答(5)

你要先用正则把<>都去掉.然后就能获取到

吴瑞祥 | 园豆：29449 (高人七级) | 2015-07-09 17:00

用正则把<>都去掉？然后怎么做呢？

吴老师如果能在百忙之中帮忙写一下code, 晚辈会万分感谢！

支持(0) 反对(0) GEEKc | 园豆：39 (初学一级) | 2015-07-09 17:03

@GEEKc: [<].*?[>] replace("")

支持(0) 反对(0) 吴瑞祥 | 园豆：29449 (高人七级) | 2015-07-09 17:07

@吴瑞祥: 还是不太懂，我是新人，自己研究了一下午了。

吴老师能劳驾您帮忙写一段完整的code吗？多谢。

支持(0) 反对(0) GEEKc | 园豆：39 (初学一级) | 2015-07-09 17:08

@GEEKc: 不能..什么语言什么环境.都不知道.

反正就是就用正则将"[<].*?[>]"替换为空

支持(0) 反对(0) 吴瑞祥 | 园豆：29449 (高人七级) | 2015-07-09 17:14

@吴瑞祥: 就是传统的js+html, 环境什么都行， Notepad++即可

多谢吴老师了。

支持(0) 反对(0) GEEKc | 园豆：39 (初学一级) | 2015-07-09 17:24

var sourceText ='there';

sourceText =sourceText .replace(/<span[^>]*>/g,"").replace(/<\/span>/g,"");

console.log(sourceText );

收获园豆：20

司幸 | 园豆：319 (菜鸟二级) | 2015-07-09 17:40

我并不是要取出there，以sourceText为情况2和需要处理的字符串是there are always举例，需要得到的结果是：Where there is great love, there

are always miracles.

支持(0) 反对(0) GEEKc | 园豆：39 (初学一级) | 2015-07-10 09:50

@GEEKc: 你不就是因为有匹配不到there are always么。现在直接对处理后的字符串执行你之前执行的替换不就行了

支持(0) 反对(0) 司幸 | 园豆：319 (菜鸟二级) | 2015-07-10 09:55

@司幸: 因为sourceText在这之前可能就已经有span标签存在字符串里面了，如果把这些处理掉的话，是能匹配到there are always，也能追加进去，但是之前的标签就没了。这里需要保存原来的标签。

支持(0) 反对(0) GEEKc | 园豆：39 (初学一级) | 2015-07-10 10:00

@GEEKc: 了解了,你的意思是 there areaways 这种情况也是会出现的吗。替换后there areaways ?

支持(0) 反对(0) 司幸 | 园豆：319 (菜鸟二级) | 2015-07-10 10:22

@司幸: 对，就是可能的情况是

there 
are always 替换成 there are always
也可能是there are always 替换成 there are always

还可能是there are always 替换成 there are always
也就是每个单词都有可能会被这么一组span标签所标注。我们需要从原始字符串中找到一串指定字符串加上

多谢司幸老师，有劳了 :[

支持(0) 反对(0) GEEKc | 园豆：39 (初学一级) | 2015-07-10 10:31

@GEEKc: var tem = sourceText .match(/(<span[^>]*>)*\s*there\s*(<\/span>)*\s*(<span[^>]*>)*\s*are\s*(<\/span>)*\s*(<span[^>]*>)*\s*always\s*(<\/span>])*/g);

for(tem){

sourceText=sourceText .replace(tem[i],tem[i])

}

console.log(sourceText)

支持(0) 反对(0) 司幸 | 园豆：319 (菜鸟二级) | 2015-07-10 11:34

@司幸: 司幸老师，这个for循环是什么语法啊？没有这种写法吧？

跪求完整的能运行的demo。多谢了。

支持(0) 反对(0) GEEKc | 园豆：39 (初学一级) | 2015-07-10 15:13

string pattern = @"(((<(\w+[^<]*?)>)|(?<=\b|\s))*there(<(/\w+|\w+[^<]*?)>|\b|\s)*are(<(/\w+|\w+[^<]*?)>|\b|\s)*always(\s*</\w+>|(?=\b|$))*)";
string sourceText = "Where there is great love, there are always miracles.";
string text = Regex.Replace(sourceText, pattern, "*$1*"); //把 * 换成你要的

收获园豆：10

Yu | 园豆：12990 (专家六级) | 2015-07-09 20:27

这是C#正则吗？我把这个转成JS正则以后报错了。大神，能帮忙写一个完整点的JS正则吗？

支持(0) 反对(0) GEEKc | 园豆：39 (初学一级) | 2015-07-10 09:51

@GEEKc:

var t='there are always';
var r=/(((<(\w+[^<]*?)>)|(\b|\s))*there(<(\/\w+|\w+[^<]*?)>|\b|\s)*are(<(\/\w+|\w+[^<]*?)>|\b|\s)*always(\s*<\/\w+>|(\b|$))*)/g;
var hightlight='';
document.write(t.replace(r,hightlight+"$1"+""));

支持(0) 反对(0) Yu | 园豆：12990 (专家六级) | 2015-07-10 12:41

@Yu: 还是不行啊，运行的时候匹配不到情况2啊

支持(0) 反对(0) GEEKc | 园豆：39 (初学一级) | 2015-07-10 15:14

@GEEKc: 那你测试有问题

支持(0) 反对(0) Yu | 园豆：12990 (专家六级) | 2015-07-10 15:46

@GEEKc: 以下是通过的

var t='Where there is great love, <span style="color: #0000ff; font-weight: bold;">there</span> <span style="color: #0000ff; font-weight: bold;">are</span> always miracles.';
var r=/(((<(\w+[^<]*?)>)|(\b|\s))*there(<(\/\w+|\w+[^<]*?)>|\b|\s)*are(<(\/\w+|\w+[^<]*?)>|\b|\s)*always(\s*<\/\w+>|(\b|$))*)/g;
var hightlight='<span style="background-color:yellow;font-we；ight:inherit;">';
document.write(t.replace(r,hightlight+"$1"+"</span>"));

支持(0) 反对(0) Yu | 园豆：12990 (专家六级) | 2015-07-10 15:48

@Yu: 这个background-color:yellow;font-we；ight:inherit;是写错了还是正则的语法啊？

算了，不纠结了，答案已经有了。谢谢Yu老师悉心指导。

支持(0) 反对(0) GEEKc | 园豆：39 (初学一级) | 2015-07-10 16:00

@GEEKc: 写错的，改成 background-color:yellow;font-weight:inherit;

支持(0) 反对(0) Yu | 园豆：12990 (专家六级) | 2015-07-10 17:09

话说，你的需求应该是指定关键字高亮吧？直接用正则替换不行么？

收获园豆：10

幻天芒 | 园豆：37207 (高人七级) | 2015-07-10 10:18

对，就是关键字(可能是一个句子也可能只是一个单词)高亮加黄色背景。但是原始的字符串中可能某些单词已经被做其他高亮处理(加粗加蓝色), 是需要用正则替换，但是这个正则不会写。

幻老师可以帮忙写一个小的demo吗？多谢了。

支持(0) 反对(0) GEEKc | 园豆：39 (初学一级) | 2015-07-10 10:33

@GEEKc: 需要将原本的高亮干掉？如果不需要的话，直接取出result = innerHTML.replace(/xxx/gi, '高亮之后的html代码'); 然后再赋值回去。。

支持(0) 反对(0) 幻天芒 | 园豆：37207 (高人七级) | 2015-07-10 10:59

@幻天芒: 嗯，就像头头老师说的那样，多谢幻老师了，在线等！

支持(0) 反对(0) GEEKc | 园豆：39 (初学一级) | 2015-07-10 11:07

@请叫我头头哥: 多谢头头哥老师

支持(0) 反对(0) GEEKc | 园豆：39 (初学一级) | 2015-07-10 11:08

@GEEKc: 我用正则是玩不转这个的，那就只能一层层的去解析，然后分别处理了。我的方法太复杂了，先尝试下他们提供的正则匹配嘛吧。。

支持(0) 反对(0) 幻天芒 | 园豆：37207 (高人七级) | 2015-07-10 12:04

@请叫我头头哥: 头头哥，我正则太弱，用正则搞不定。。。

支持(0) 反对(0) 幻天芒 | 园豆：37207 (高人七级) | 2015-07-10 12:31

@幻天芒: 老幻，你也太谦虚了吧？我看是你不愿意弄而已。话说这个正则难倒是不难，但是确实挺麻烦的。

支持(0) 反对(0) 请叫我头头哥 | 园豆：9382 (大侠五级) | 2015-07-10 15:27

@请叫我头头哥: 我看着大片的正则，我就头大。。

支持(0) 反对(0) 幻天芒 | 园豆：37207 (高人七级) | 2015-07-10 16:28

var words = ["there", "are", "always"];
var txt = 'Where there is great love, there \tare always miracles.'
if (new RegExp("((<.*?>)?" + words.join('(</.*?>)?\t? ?(<.*?>)?') + "(</.*?>)?)").test(txt)) txt = txt.replace(RegExp.$1, '' + RegExp.$1 + '');

收获园豆：20

长蘑菇星人 | 园豆：1832 (小虾三级) | 2015-07-10 11:38

大神，你这得到的结构是Where there is great love, there are always miracles. 只有there被高亮了。我的需求是words 数组里的都得高亮。、

多谢了。能帮忙继续写写demo吗？

支持(0) 反对(0) GEEKc | 园豆：39 (初学一级) | 2015-07-10 15:16

@GEEKc: var words = ["there", "are", "always"];
var txt = 'Where there is great love, there are always miracles.'
if (new RegExp("((<.*?>)?" + words.join('(</.*?>)? ?(<.*?>)?') + "(</.*?>)?)").test(txt)) txt = txt.replace(RegExp.$1, '' + RegExp.$1 + '');

写错了 (。。。

支持(0) 反对(0) 长蘑菇星人 | 园豆：1832 (小虾三级) | 2015-07-10 15:35

@长蘑菇星人: 这个的确也是可以匹配出来的，但是不太符合我的这个需求。不过还是谢谢大神。

支持(0) 反对(0) GEEKc | 园豆：39 (初学一级) | 2015-07-10 15:59

清除回答草稿

您需要登录以后才能回答，未注册用户请先注册。

欢迎，请先 登录 或者 注册 。

JS replace 正则：求大神进来看一看，弄了一下午了没弄出来

欢迎，请先登录或者注册。