PHP如何识别动态变化的CSS类并爬取display:inline类对应内容

• 拉取目标页面完整HTML源码
• 解析页面内嵌/外链的CSS规则，遍历所有针对span类选择器的样式，匹配出display: inline对应的类名（自动跳过设置display: none的隐藏类）
• 遍历页面所有span元素，匹配上一步识别到的可见类名，提取对应文本拼接得到最终结果

<?php
// 拉取目标页面内容，可替换为curl请求适配自定义请求头、代理场景
$targetUrl = "https://example.com/demo-page";
$html = file_get_contents($targetUrl);

// 解析CSS规则，识别可见的span类名
$visibleClasses = [];
// 匹配所有span.类名 { 样式规则 } 的CSS块
preg_match_all('/span\.([a-zA-Z0-9_-]+)\s*\{([^}]+)\}/i', $html, $styleMatches, PREG_SET_ORDER);
foreach ($styleMatches as $match) {
    $className = trim($match[1]);
    $styleBlock = trim($match[2]);
    // 拆分样式块内的各个属性
    $properties = array_filter(explode(';', $styleBlock));
    foreach ($properties as $prop) {
        $prop = trim($prop);
        // 提取display属性的值，兼容PHP7及以上版本
        if (strpos($prop, 'display:') === 0) {
            $displayValue = trim(explode(':', $prop)[1]);
            if ($displayValue === 'inline') {
                $visibleClasses[$className] = true;
            }
        }
    }
}

// 用DOM解析页面内容，提取对应类名的span文本
libxml_use_internal_errors(true); // 抑制非规范HTML的解析警告
$dom = new DOMDocument();
$dom->loadHTML($html);
$xpath = new DOMXPath($dom);

$extractedContent = '';
$spanNodes = $xpath->query('//span');
foreach ($spanNodes as $span) {
    $classAttr = trim($span->getAttribute('class'));
    if (empty($classAttr)) continue;
    // 拆分span可能携带的多个类名
    $spanClasses = array_filter(explode(' ', $classAttr));
    foreach ($spanClasses as $cls) {
        if (isset($visibleClasses[trim($cls)])) {
            $extractedContent .= $span->nodeValue;
            break;
        }
    }
}

// 输出最终提取的内容
echo $extractedContent;

• 如果站点将相关样式放在外链CSS文件中，可先解析HTML内的link标签获取CSS地址，拉取CSS文件内容后复用上述规则解析逻辑，无需修改核心判断流程
• 遇到CSS层叠覆盖场景，遍历样式规则时不要提前终止，以最后出现的同类选择器规则为准，确保匹配到最终生效的样式值
• 若span节点内部嵌套有其他标签，可根据实际结构调整文本提取逻辑，避免把嵌套节点的无效内容一并提取
• 若匹配到的类名同时存在display: inline和display: none两种规则，要按CSS的层叠优先级做判断，避免提取到隐藏内容

内容的提问来源于stack exchange，提问作者newJavaCoder