CSS类名的正则表达式 - Regular expression for CSS class names

Regular expression for CSS class names

本文关键字：正则表达式 CSS | 更新日期: 2023-09-27

我试图在PHP中创建一个函数，该函数将通过CSS和JS文件，并替换CSS选择器中的类名称和id(但不是直接的HTML元素或CSS属性)，而不会干扰其他内容。然而，在世界上所有的倒霉事中，我在正则表达式方面是毫无希望的。

我有两个数组，一个包含"原始"单词，另一个包含我想要转换成的单词。

$array1 = array("ul", "text", "border");
$array2 = array("bar", "foo", "far");
$str = magic($str, $array1, $array2);

这个神奇的函数会改变下面的CSS文件

#test-text ul {
    text-decoration: none;
}
.ul-border span {
    border: 1px solid #fff;
}
#text.niceborder {
    border-color: #ccc;
}

到

#test-foo ul {
    text-decoration: none;
}
.bar-far span {
    border: 1px solid #fff;
}
#foo.nicefar {
    border-color: #ccc;
}

我希望相同的函数可以用来做同样的事情为jQuery选择器在JS，但如果我得到的基本逻辑背后找到适当的选择器和应用数组仅为。和# segments，我想我可以自己做一个$()改编;)

Thank you kindly

我不知道你为什么需要它，但我认为这是你想要的功能:

<?php
/**
 * Replaces all occurences in a CSS class or ID name with the provided replacement.
 * 
 * @param string $subject
 * @param array $search
 * @param array $replace
 * @return string 
 */
function replaceNames($subject, $search, $replace)
{
    // First generate all search regular expressions
    $searchRegexpressions = array_map(function($s)
    {
        return '/(['#'.][a-z0-9'-_]*)(' . preg_quote($s) . ')/i';
    }, $search);
    // Now all associated replacement expressions
    $replaceRegexpressions = array_map(function($r)
    {
        return '$1' . $r;
    }, $replace);
    do {
        // Now do the replacements as often as necessary to replace every occurence.
        $subject = preg_replace($searchRegexpressions, $replaceRegexpressions, $subject, -1, $count);
    } while ($count > 0);
    return $subject;
}
?>

解释正则表达式:

/(['#'.][a-z0-9'-_]*)(' . preg_quote($s) . ')/i

必须以#或。
字母，数字或- _可以随他们想要的次数跟随(*)。(如果你有更时髦的类名，你可能需要添加字符。)

还有:我使用过匿名函数。如果您不使用PHP 5.3.0+，则必须实际创建两个映射函数，并使用:array_map(mySearchRegexFuncion, $search);。

我很难找到你想做的事情会是个好主意的理由。如果你只是想根据一些设置或基于PHP的逻辑改变一堆样式，只需使用PHP生成一个类名，然后可以使用它来生成覆盖CSS规则。

一样:

<?php
  $a = "my-a-style";
  $b = "my-b-style";
  $parentClass = someLogicalFunction() ? $a : $b;
?>
<div class="<?php echo $parentClass; ?>">
  <div id="test">
    <ul>
      <li><span>Some Stuff</span></li>
    </ul>
  </div>
</div>

现在你可以创建单独的css规则:

.my-a-style #test {}
.my-b-style #test {}