替换评论之间的内容

时间:2018-02-14 14:10:12

标签: javascript regex css-parsing

我想替换两个评论之间的内容,例如

/**** Useless CSS ****/
.my-class{
 margin: 12px;
}

/* Several Lines after including other comments **/

/**** END Useless CSS ****/

.other {
 padding: 12px;
}
/* Hello */

到目前为止,我有:

[\/* Useless CSS \*\/](.|[\r\n])*?END Useless CSS \*\*\*\*\/?

但这不起作用。我在Regex101中遇到了错误:灾难性的回溯

3 个答案:

答案 0 :(得分:2)

您的部分问题是正则表达式的第一部分。您正在使用[\/* Useless CSS \*\/],一个字符类,这意味着此集合中的任何字符。换句话说,任何以下字符(删除重复的字母后):/* UselCS。这绝对不是你的意图,但这就是它正在做的事情。下面的代码从模式中删除了字符类,以便它明确地匹配/**** Useless CSS ****/

第二个变化是将(.|[\r\n])*?变为[\s\S]*?。每次都不需要对两个选项进行正则表达式检查。如果它是一组字符,只需将它们添加到同一个字符类中即可。 [\s\S]是一种表示任何字符(包括换行符)的方式。另一种方式(适用于JavaScript,但不是很多其他正则表达式引擎)是使用[^]

第三项更改是将\*\*\*\*更改为\*{4}。这不仅更短,更容易理解,而且还提高了性能,因为正则表达式引擎不需要通过令牌\*,然后是\*,然后\*等来进行令牌。它是被告知要匹配*四次,因此它会一次性而不是4次。这意味着\*\*\*\*需要四个步骤,而\*{4}只需要一个。

您还可以将\s*附加到末尾以删除其他空格。

\/\*{4} Useless CSS \*{4}\/[\s\S]*?\/\*{4} END Useless CSS \*{4}\/

var s = `/**** Useless CSS ****/
.my-class{
 margin: 12px;
}

/* Several Lines after including other comments **/

/**** END Useless CSS ****/

.other {
 padding: 12px;
}
/* Hello */`
var r = /\/\*{4} Useless CSS \*{4}\/[\s\S]*?\/\*{4} END Useless CSS \*{4}\//gi

console.log(s.replace(r, ''))

答案 1 :(得分:2)

仅仅因为你可能使用正则表达式并不意味着 使用正则表达式。

let css = `
.boat {
	float: left;
}

/**** Useless CSS ****/
.my-class{
 margin: 12px;
}

/* Several Lines after including other comments **/

/**** END Useless CSS ****/

.other {
 padding: 12px;
}
/* Hello */`;

const START_DELIMITER = '/**** Useless CSS ****/';
const END_DELIMITER = '/**** END Useless CSS ****/';

const left = css.slice(0, css.indexOf(START_DELIMITER));
const right = css.slice(css.indexOf(END_DELIMITER) + END_DELIMITER.length);

console.log(left + 'NEW STUFF' + right);

答案 2 :(得分:1)

你的正则表达式几乎可以工作,但你应该考虑如下所示的一些变化:

(\/\*+ Useless CSS \*+\/)(.|[\r\n])*?END Useless CSS \*\*\*\*\/
^  ^ ^               ^  ^

说明:

  • [...]更改为(...)。前者定义了一个字符类,后者是一个组。
  • 转义*表示一个字面字符,否则它将作为正则表达式量词

  • 使用\*量化+以匹配序列中的*个字符。

Live demo

(.|[\r\n])也应该匹配任何角色到一个点是[\s\S][^](在JS中)的不良替代方案。此外,我会在模式的末尾添加\s*以匹配左侧空格:

\/\*+ Useless CSS \*+\/[^]*?END Useless CSS \*+\/\s*
                                                 ^^^

Live demo