如果为负数或正数，如何更改数字的颜色？

Question

我有一个 function 计算从今天到昨天以及本周与前一周相比的销售额差异。 我如何更改它，以便如果值为负，则变为红色，如果值为正或中性，则为绿色？

这是我的 HTML：

<div class="card-footer-transparent text-center pt-2">
<span id="span_day_diff">TBC</span> from previous day
</div>

这是我的 JS Function：

       function dif_day(data) {
         val = data[0]
         var day= []
         day.push(val.DAY_DIFF);
         if (day[0] >= 0) {
            $('#span_day_diff').empty().append("+ " + day.join()); 
         } else {
            $('#span_day_diff').empty().append(day.join()); 
         };
       };

Answer 1

你需要css方法来设置颜色

     if (day[0] >= 0) {
        $('#span_day_diff').empty().append("+ " + day.join()); 
        $('#span_day_diff').css('color', 'green');
     } else {
        $('#span_day_diff').empty().append(day.join()); 
        $('#span_day_diff').css('color', 'red');
     };

Answer 2

如果您只是想为 label 设置样式，为什么不使用

document.getElementById('mySpan').classList.add('positive')

---

    .positive {
        color: green;
    }

    .negative {
        color: red;
    }

    .default {
        color: gray;
    }

Answer 3

尝试这个。

function dif_day(data) {
         val = data[0]
         var day= [];
         day.push(val.DAY_DIFF);

         if (day[0] >= 0) {
            $('#span_day_diff').empty().append("+ " + day.join()); 
            $('#span_day_diff').style.color = 'green';
         } else {
            $('#span_day_diff').empty().append(day.join()); 
            $('#span_day_diff').style.color = 'red';
         }

       };