着色负数/正数(jQuery)

Question

我想在表格中为数字着色以提高可读性: 

• 绿色为正(+00.00);
• 红色表示负数(-00.00)和;
• 黑色为默认情况下(无符号)

Answer 1

你走了:

$(document).ready( function() {

  // the following will select all 'td' elements with class "of_number_to_be_evaluated"
  // if the TD element has a '-', it will assign a 'red' class, and do the same for green.

  $("td.of_number_to_be_evaluated:contains('-')").addClass('red');
  $("td.of_number_to_be_evaluated:contains('+')").addClass('green');
}

然后使用CSS来设置输入元素的样式:

td.red {
  color: red;
}

td.green {
  color: green;
}

Answer 2

仅 CSS，没有 javascript 解决方案。我在这里找到它http://rpbouman.blogspot.ru/2015/04/css-tricks-for-conditional-formatting.html

    /* right-align monetary amounts */
    td[data-monetary-amount] {
      text-align: right;
    }

    /* make the cells output their value */
    td[data-monetary-amount]:after {
      content: attr(data-monetary-amount);
    }

    /* make debit amounts show up in red */
    td[data-monetary-amount^="-"]:after {
      color: red;
    }

  <table border="1">

   <tr>
    <th>Gain</th>
    <td data-monetary-amount="$100"></td>
   </tr>

   <tr>
    <th>Losst</th>
    <td data-monetary-amount="-$100"></td>
   </tr>

  </table>