如何通过@if语句为Table元素添加多个CSS类（无需JavaScript）

嘿，我太懂你现在的困扰了——原来的写法会生成多个class属性，这在HTML里是不规范的，浏览器也只会认第一个。完全不用JavaScript就能搞定，咱们只需要把所有类的判断逻辑合并到同一个class属性里就行，给你两种实用的方案：

方案1：三元运算符直接拼接（适合少量条件） #

这是最直接的写法，上手快：

<table class="{{ empty($a) ? 'hide_a' : '' }} {{ empty($aa) ? 'hide_aa' : '' }} {{ empty($aaa) ? 'hide_aaa' : '' }}">

如果你的PHP环境不支持短标签（{{ }}），换成标准写法也一样：

<table class="<?php echo empty($a) ? 'hide_a' : ''; ?> <?php echo empty($aa) ? 'hide_aa' : ''; ?> <?php echo empty($aaa) ? 'hide_aaa' : ''; ?>">

符合条件的类名会被空格分隔，完美合并到一个class属性里，浏览器能正确识别多个类。

方案2：数组收集类名（更易扩展） #

如果以后要加更多类判断，用数组的方式会更整洁，维护起来也省心：

<?php
// 初始化空数组存符合条件的类名
$tableClasses = [];

// 逐个判断，满足条件就加入数组
if (empty($a)) $tableClasses[] = 'hide_a';
if (empty($aa)) $tableClasses[] = 'hide_aa';
if (empty($aaa)) $tableClasses[] = 'hide_aaa';

// 把数组转成空格分隔的字符串
$classList = implode(' ', $tableClasses);
?>

<!-- 把拼接好的类名放到table的class属性里 -->
<table class="<?php echo $classList; ?>">

这种方式的好处是，哪怕后面要加10个类判断，只要往数组里加新的if就行，代码不会变得乱糟糟。

两种方案都完全不需要JavaScript，还严格符合HTML规范，比原来的多class属性写法靠谱多啦！

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