javascript - 使用 2 个小数位格式化货币值并将负值更改为红色

Question

我正在尝试格式化货币值以仅显示 2 位十进制数字，并更改输出值(如果为负)。目前，输出呈现 14 个十进制字符，偏差 0.01 美元!

我有一个JSFiddle显示了描述我遇到的这两个问题的输出。

JavaScript 非常简单!也许它的简单性是问题的原因。这是脚本:

var accountbalance = 99.99;
var renewalfee = 64.95;
var balanceafterrenewal = (accountbalance - renewalfee);
document.getElementById("remainingBalance").innerHTML = balanceafterrenewal;

呈现输出的 HTML 代码如下:

<div class="remainingbalancelabel">Remaining Balance Rendering Output</div>
   $<span id="remainingBalance"></span>
</div>

如果有任何帮助，我将不胜感激:

1. 设置剩余余额的格式以正确显示正确的值
2. 设置剩余余额的格式以仅显示 2 位小数字符
3. 当剩余余额变为负数时，将其颜色更改为红色

我先谢谢你了! :)

Answer 1

使用.toFixed设置为一定的小数位数:

document.getElementById("remainingBalance").innerHTML = balanceafterrenewal.toFixed(2);

分配给元素的 .style.color 以更改其颜色:

const accountbalance = 99.99;
const renewalfee = 100;
const balanceafterrenewal = (accountbalance - renewalfee);
document.getElementById("remainingBalance").innerHTML = balanceafterrenewal.toFixed(2);
if (balanceafterrenewal < 0) document.getElementById("remainingBalance").style.color = 'red';

<span id="remainingBalance"></span>