Question

我正在尝试在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;
}

我希望可以使用相同的函数为JS中的jQuery选择器执行相同的操作，但是如果我找到适当的选择器并仅应用于数组的基本逻辑。和＃段，我想我可以自己进行$()改编;）

谢天谢地

Answer 1

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

<?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);代替。

Answer 2

我很难找到一个理由，你要做的事情永远都是个好主意。如果你想根据一些设置或基于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 {}

CSS类名的正则表达式

2 个答案: