将计数 javascript 程序设置为小数点后两位

Question

请看这段代码：

<script>
setInterval(function () {
    var counters = document.getElementsByClassName("count");

    for(var i = 0 ; i < counters.length ; i++) {
        counters[i].innerHTML = parseInt(counters[i].innerHTML) + parseInt(counters[i].dataset.increment);
    }
}, 1000);
</script>

它的作用是像这样取一块 html：

<div class="count" data-increment="10">10</div>

并且每秒计数10。如何使以下代码工作：

<div class="count" data-increment="10.02">10.02</div>

基本上，我想让这个程序最多计算两位小数。

Answer 1

使用 parseFloat 而不是 parseInt。 toFixed(2) 限制两位小数。

setInterval(function() {
    var counters = document.getElementsByClassName("count");

    for (var i = 0; i < counters.length; i++) {
        counters[i].innerHTML = parseFloat(counters[i].innerHTML).toFixed(2) + parseFloat(counters[i].dataset.increment).toFixed(2);
    }
}, 1000);

Answer 2

JSFIDDLE 您需要使用 parseFloat 将字符串转换为浮动。和 toFixed on float 截断多余的小数。 toFixed return string 你需要再次使用 parseFloat 以便它变成 float 添加而不是字符串连接。

var counters = document.getElementsByClassName("count");
    
    setInterval(function () {
        for(var i = 0 ; i < counters.length ; i++) {
            
            counters[i].innerHTML = (parseFloat(parseFloat(counters[i].innerHTML).toFixed(2)) + parseFloat(parseFloat(counters[i].dataset.increment).toFixed(2))).toFixed(2);
        }
    }, 1000);

<div class="count" data-increment="10">10</div>

<div class="count" data-increment="10.02">10.02</div>

Answer 3

尝试在 String() 、 .innerHTML 、 .dataset 内包装 Number() 、 Number() 在链接到 [=18 的表达式 () 内=];将 counters[i].innerHTML 设置为在 String((Number(/* innerHTML */) + Number(/* dataset *)).toFixed(2))

内得出的结果

var interval = setInterval(function() {
  var counters = document.getElementsByClassName("count");

  for (var i = 0; i < counters.length; i++) {
    counters[i].innerHTML = String((Number(counters[i].innerHTML) 
                            + Number(counters[i].dataset.increment)).toFixed(2));

  }
}, 1000);

<div class="count" data-increment="10.02">10.02</div>

将计数 javascript 程序设置为小数点后两位

Set counting javascript program to two decimal places

html

javascript

decimal

counting