Question

使用以下输入：

#element{ color: #333; }
#element2,
.element3,
.whatever{ background: red; }

.test,
.test2, .test3,
#test111,
.element5555, #fooooooter{ display: none; }

#element8 tr .bacon{ font-size: 10000em; }

如何使用正则表达式匹配这些：

#element  
#element2  
#element8
#test111

并不符合这些：

#333

到目前为止，我尝试了更多变化，但我无法提出任何有用的信息。

这是我最近尝试的内容：

(#).*[{]

但它似乎跳过了一些选择器。

Answer 1

#-?[_a-zA-Z]+[_a-zA-Z0-9-]*(?=[^}]*\{)

它明确匹配CSS选择器中的有效字符。 Which characters are valid in CSS class names/selectors?

http://regexr.com?36e6v

在应用此正则表达式之前，请不要忘记删除评论和引用，例如content: '{}'。正则表达式可以匹配注释和引用。单独使用展开技能将其删除。（我认为展开是复杂且低效的，足以统治整合。）

如果{}块嵌套在Sass中，则匹配颜色

Answer 2

好的，看看这个，它完全符合你的需要;

^\#[a-z]+[0-9]* //(Multiline = true)

如果您需要捕获 ID名称，请使用此选项;

^\#(?<IDName>[a-z]+[0-9]*)  //(Multiline = true)

此正则表达式有一个名为 IDName 的捕获组，它为您提供 ID 的名称。

演示here。

Answer 3

好的，我想我得到了它（http://regexr.com?36e5i）：

#[^{,;]*(?:[{,\n])也会匹配其他选择器后跟的ID（例如，#element8 tr .bacon）

#[^ {,;]*(?:[ {,\n])仅匹配ID（因此您将获得上述示例中的#element8部分，而不是其余部分）

Answer 4

试试这个/＃[^ 1-9] + / g

var t=" #element ";
var p=t.search(/#[^1-9]+/g);
alert(p);

或/#[^1-9.@#$%^&*()！] +/g如果想删除除数字以外的其他符号

Answer 5

根据评论升级

这对你有用：

/(?![^{]+})(#\S+)\b/g

在此处查看：http://regex101.com/r/rF9iR9

正则表达式匹配css文件中的ID？

5 个答案: