1

我有一个包含多个 css 类的长字符串。使用正则表达式，我想匹配每个类名，因为我需要像这样替换这些类名：

<span>CLASSNAME</span>

我已经尝试了几个小时来想出一个解决方案，我认为我已经很接近了，但是对于某些类名，我无法从匹配中排除右大括号。

这是我一直在进行测试的示例字符串：

#main .items-Outer p{ font-family:Verdana; color: #000000; font-size: 50px; font-weight: bold; }#footer .footer-inner p.intro{ font-family:Arial; color: #444444; font-size: 30; font-weight: normal; }.genericTxt{ font-family:Courier; color: #444444; font-size: 30; font-weight: normal; }

这是我到目前为止想出的正则表达式：

((^(?:.+?)(?:[^{]*))|((?:\})(?:.+?)(?:[^{]*)))

请看我附上的截图，因为它会更清楚地显示我得到的匹配。我的问题是我显然想从任何匹配中排除大括号。

正则表达式匹配

为了澄清，我所追求的匹配示例是：

  • main .items-Outer p

  • 页脚 .footer-inner p.intro

  • .genericTxt
4

3 回答 3

2

当且仅当没有任何嵌套的花括号时，以下应该有效：

/\.(-?[_a-zA-Z]+[_a-zA-Z0-9-]*)(?![^\{]*\})/

这是一个演示！

请注意，我正在为 valid-CSS-class-name 正则表达式引用这个问题。

编辑

我刚刚阅读了您的评论，说明您希望匹配整个选择器，而不仅仅是类名。在这种情况下，试试这个，虽然我对它的健壮性没有信心：

/[^}]*(?=\{|$)/

这是一个演示。

于 2012-09-12T15:51:40.447 回答
1

这是正则表达式

(?:(\}|^)).*?(?:\{)
于 2012-09-12T15:42:08.790 回答
0

假设 str 包含您的 CSS，则以下正则表达式：

str.match(/(?:#\w+\s+)?\.[\w-]+(?:\s+\w+\s*\.\w+|\s+\w+)?/ig)

返回：

["#main .items-Outer p", "#footer .footer-inner p.intro", ".genericTxt"]

正则表达式是：

(?:#\w+\s+)?      -- optional leading CSS id, i.e. #abc
\.[\w-]+          -- CSS classname, i.e. .ab-c
(?:
    \s+\w+\s*\.\w+  -- optional CSS elt followed by classname, i.e. p.abc
|                   -- or
    \s+\w+          -- optional CSS elt, i.e. p
)?

看演示

于 2012-09-12T16:10:48.763 回答