PHP渲染数据表格实现days列值≤30时文字变红的条件格式

两种方案都可以直接复用，优先选第一种服务端渲染的方案，稳定性最高。

方案1：PHP渲染层直接判断输出样式（推荐） #

不需要额外引入JS，在循环输出表格行的时候直接判断days字段值，给符合条件的单元格加红色样式即可，无加载时序问题，零依赖，兼容性最好，不会出现JS执行时机不对导致的样式失效问题。

找到你代码里输出days列的原有代码：

echo "<td>".$user_data['days']. "</td>";

替换为以下代码：

$days = (int)$user_data['days'];
if ($days <= 30) {
    // 符合条件直接加内联红色样式
    echo "<td style='color: #dc3545;'>".$days."</td>";
} else {
    echo "<td>".$days."</td>";
}

如果要统一维护样式，可以先在页面头部定义CSS类：

.cal-warning {
    color: #dc3545;
    font-weight: 500;
}

对应PHP代码调整为：

$days = (int)$user_data['days'];
$attr = $days <= 30 ? 'class="cal-warning"' : '';
echo "<td {$attr}>".$days."</td>";

方案2：原生JS实现 #

之前JS方案失效基本是两个原因：代码执行时表格DOM还没渲染完成、列索引计数错误。把以下代码放在页面</body>标签前（表格DOM渲染完成的位置）即可：

// 等页面DOM全部加载完成后执行
document.addEventListener('DOMContentLoaded', () => {
    // 遍历所有表格数据行，跳过第一行表头
    const rows = document.querySelectorAll('#table_id tr:not(:first-child)');
    rows.forEach(row => {
        // days列是第10列，单元格索引从0开始计数，对应索引为9
        const dayCell = row.cells[9];
        const dayVal = parseInt(dayCell.textContent.trim(), 10);
        if (!isNaN(dayVal) && dayVal <= 30) {
            dayCell.style.color = '#dc3545';
            // 用自定义类的话替换为 dayCell.classList.add('cal-warning')
        }
    })
})

注意：如果你的表格接入了DataTables这类动态分页/渲染的插件，需要把上述JS逻辑放到插件的渲染完成回调里执行，否则动态加载的新行不会应用样式。

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