解析 CSS 类但忽略 @media 查询答案

【问题标题】：Parse CSS classes however ignore @media queries解析 CSS 类但忽略 @media 查询
【发布时间】：2014-05-15 10:00:10
【问题描述】：

我有一个用 C# 编写的 CSS 解析器实用程序。我能够使用以下正则表达式解析和提取所有 CSS 类。这是按预期工作的。

[C#]

const string expression = "(.*?)\\{(.*?)\\}";
var regEx = new Regex(expression, RegexOptions.Singleline | RegexOptions.IgnoreCase);
var matches = regEx.Matches(styleSheet);

[CSS]

body 
{
    font-family: Helvetica Neue,Helvetica,Arial,sans-serif;
    font-size: 13px;
    color: #666666;
}

img 
{
    border: 0;
    display: block;
}

@media only screen and (max-width: 600px)
{
    table[class=bodyTable] 
    {
        width: 100% !important;
    }

    table[class=headerlinks]
    {
        display:none !important;
    }
}

a 
{
    text-decoration: none;
}

但是现在我们的软件已经开始支持媒体查询，出于某种原因，我们希望在 CSS 解析期间忽略整个媒体查询。所以它应该只匹配body、img和a。

感谢有人可以帮助我编写新的正则表达式:)

[解决方法] 获得所有匹配项后，在我的代码中，我必须使用 foreach 进行一些处理 -

foreach(Match match in matches)
{
    var selectorString = match.Groups[1].ToString();

    if (selectorString.IndexOf("@media", StringComparison.InvariantCulture) > -1)
        continue;

    // processing...
}

【问题讨论】：

我将把它交给正则表达式专家，但我一直在尝试解决这个问题。我的第一个猜测是使用环视来确定匹配集是否以@media 开头。但是，在处理任意嵌套的@media 时，曾经匹配过任何子组。解释可能在这里：stackoverflow.com/questions/133601/… 我可能是错的，但我倾向于效率低下并使用substring 删除@media 部分，然后再喂你的正则表达式匹配器
到目前为止，我使用了一种解决方法来首先获取所有匹配项并消除具有@media 的匹配项。我还尝试过使用负面环视link，但没有运气。
但是上面的解决方法并没有给我一个好的感觉，我想使用更干净的正则表达式。
是的，我对负前瞻也没有运气。如果您认为这会有所帮助，您可以将您的解决方法发布为编辑。也许在代码审查中？
不可能有一个万无一失的正则表达式来解析 CSS。您将遇到字符串值和 cmets 的问题。使用实际的解析器比使用正则表达式更好。

标签： c# css regex

【解决方案1】：

通过使用消极的后视，我们得到了一个更优雅的解决方案。我会写一些形式的东西：

((?:(?<!@media).)*?){(.*?)}

或者，展开：

(                // start 1st group
  (?:            // start non-capturing group (complex expression)
    (?<!@media)  // match if not preceded by @media
    .            // now match any character
  )*?            // any number of times
)                // end of 1st group
{                // match literal {
(                // start 2nd group
  .              // any character
  *?             // any number of times
)                // end of 2nd group
}                // match literal }

看看https://www.debuggex.com/r/QgjgoymphZ1Ska25。

注意：根据需要随意添加转义...

【讨论】：

感谢您的回复。不幸的是，它只忽略了媒体一词……而不是整个媒体标签匹配:(