Php 解析css文件并使用类作为键构建背景图像数组

我想在php中加载一个css文件，然后创建一个包含所有背景图像的数组，其中css类用作数组键，忽略所有其他不调用背景图像的css块。下面是伪代码，但我猜它看起来像这样：

function makeArrayOfBackroundImages($css) {
    $foo = someRegExKungfu;
    foreach ($foo as $class => $background) {
        $bar[] = $class => $background;
    }
    return $bar;
}

$css = file_get_contents('http://www.mysite.com/global.css');

$css = makeArrayOfBackroundImages($css);

因此，对于以下css内容：

.content1 {
    background-image: url("http://mycdn.com/images/image1.png");
}
.content2 {
    background-image: url("http://mycdn.com/images/image2.png");
}
.content3 {
    background-image: url("http://mycdn.com/images/image3.png");
}
.content4 {
    margin:20px;
    border:1px solid #000;
}

数组看起来是这样的：（注意，只有具有背景图像的类才具有特征）

我这样做的原因是因为我正在构建一个脚本来测试一个页面的下载速度，为了让它成为一个真正的测试，我还想下载主页上使用的所有背景图像，但是css中列出的其他类和背景图像用于主页以外的页面。通过使用以下代码，我拥有主页上使用的所有类的数组：

@$dom->loadHTML('http://www.mysite.com');
$elems = $dom->getElementsByTagName('*');
foreach ($elems as $elm) {  
    if ($elm->hasAttribute('class')) {
        $classes[] = $elm->getAttribute('class');
}
}

因此，一旦我从上面的代码中得到了页面上使用的类，以及一个包含所有背景图像和类名的数组，我将下载背景图像，我有一个匹配的类名。希望有意义。

试试这个功能：

function makeArrayOfBackroundImages($css) {
    if (!preg_match_all('/\.([a-z\d_]+)\s*\{[^{}]*url\("?([^()]+)"?\)?/i', $css, $arr)) return array();
    return array_combine($arr[1], $arr[2]);
}

---

注意：每个类只提取一个（第一个）图像url。因此，它不适用于处理多个背景图像。

对于css3多个背景图像，您有什么期望？URL数组？类似于

[content4]=>数组（'url1'，'url2'，'url3'）

？如果你对测试性能/页面加载时间很认真，请使用真正的浏览器，类似于：

webdriverjs

@Ben Paton如果这个答案解决了你的问题，你可以对它进行投票

function makeArrayOfBackroundImages($css) {
    if (!preg_match_all('/\.([a-z\d_]+)\s*\{[^{}]*url\("?([^()]+)"?\)?/i', $css, $arr)) return array();
    return array_combine($arr[1], $arr[2]);
}