Javascript 更改负数的字体css

当数字小于0时，我尝试将字体颜色更改为红色。在上面时为绿色。由于stackoverflow的回答，我成功地使整行变为红色，但无法将其转换为字体本身

显示一个可能为负数的数字

<tr>
    <td><?php echo $coin_name; ?></td>
    <td><?php echo $coin_price; ?></td>
    <td class="status"><?php  echo $coin_gain; ?>%</td>
</tr>

<script>
    $(document).ready(function() {
        $(".status").each(function(){
            var value = parseInt ( $( this).html() );
            if (value < 0){
                $(this).parent().css('background-color', 'red');
            }
        });
    });
</script>

%
$（文档）.ready（函数（）{
$（“.status”）。每个（函数（）{
var value=parseInt（$（this.html（））；
如果（值<0）{
$（this.parent（）.css（'background-color'，'red'）；
}
});
});

%
$（文档）.ready（函数（）{
$（“.status”）。每个（函数（）{
var value=parseInt（$（this.html（））；
如果（值<0）{
$（this.css（'color'，'red'）；
}
});
});

---

只需删除父选择器，即可将目标定位到单元格本身而不是行。

如果要将目标定位到单元格，请删除

.parent（）

：

if（值<0）{
$（this.css（'color'，'red'）；
}否则{
$（this.css（'color'，'green'）；
}

---

当您添加

.parent（）

时，您的目标是单元格的包含元素（

），即行（

）

如果您使用PHP输出，那么也可以使用PHP处理类：

对于字体颜色，它是

颜色：#000000

而不是

背景色

<?php $isPositive = $coin_gain >= 0; ?>
<tr style="background-color: <?= $isPositive ? 'green' : 'red'; ?>>
    <td><?= $coin_name; ?></td>
    <td><?= $coin_price; ?></td>
    <td class="status" style="color: <?= $isPositive ? 'green' : 'red'; ?>><?= echo $coin_gain; ?>%</td>
</tr>

>%

%
$（文档）.ready（函数（）{
$（“.status”）。每个（函数（）{
var value=parseInt（$（this.html（））；
如果（值<0）{
//这将改变字体的颜色
$（this.css（'color'，'red'）；
}
});
});

我不觉得害羞吗。刚刚完成，准备删除问题。及时回复没有问题。我已经做了一个快速编辑-我注意到你想要改变字体颜色。我已经编辑了以反映这一点。谢谢你。祝你平安快乐christmas@Mark.S作为旁注。您可以在样式表中将默认字体颜色设置为绿色，然后只要在遇到0以下的数字时更改字体颜色即可。这将节省您执行if-else语句的时间。只需尝试一下，然后检查我的问题即可删除。我可以做一个else语句，使其在高于0时变为绿色吗？如果将默认颜色设置为绿色，并且在遇到负值时将字体设置为红色，这将更容易，更具语义。我认为，即使使用服务器端方法不断刷新特定变量的样式，也会影响性能。Javascript更适合这种情况，这是一个很好的答案。@高清如果OP已经在循环硬币数据，那么再添加几句话不会影响性能，而JS方法可以减慢用户的操作，因为一切都必须重新循环和重新评估。好吧，我想这与OP到底在做什么有关。一般来说，JS比PHP（在相同的硬件上）快得多，尽管如果在服务器端使用缓存，它可以显著提高性能，但是是的，这都与OP试图执行的操作有关。

if (value < 0){
    $(this).css('color', 'red');
} else {
    $(this).css('color', 'green');
}

<?php $isPositive = $coin_gain >= 0; ?>
<tr style="background-color: <?= $isPositive ? 'green' : 'red'; ?>>
    <td><?= $coin_name; ?></td>
    <td><?= $coin_price; ?></td>
    <td class="status" style="color: <?= $isPositive ? 'green' : 'red'; ?>><?= echo $coin_gain; ?>%</td>
</tr>

<tr>
    <td><?php echo $coin_name; ?></td>
    <td><?php echo $coin_price; ?></td>
    <td class="status"><?php  echo $coin_gain; ?>%</td>
</tr>

<script>
    $(document).ready(function() {
        $(".status").each(function(){
            var value = parseInt ( $( this).html() );
            if (value < 0){
                // this will change the color of font 
                $(this).css('color', 'red');
            }
        });
    });
</script>