js 数字平滑变化

数字平滑变化是指在一定时间内，数字逐渐变化而不是突然跳变。在JavaScript中，可以使用定时器(setInterval或setTimeout)实现数字平滑变化的效果。

以下是一个简单的示例：

// HTML部分
<p id="num"></p>

// JS部分
var num = 0;
var targetNum = 100;
var time = 1000; // 1秒钟内完成变化
var interval = 10; // 每10毫秒变化一次
var step = (targetNum - num) / (time / interval);

var timer = setInterval(function() {
  num += step;
  document.getElementById("num").innerHTML = num.toFixed(0);
  if (num >= targetNum) {
    clearInterval(timer);
  }
}, interval);

在这个示例中，我们定义了一个初始数字(num)和目标数字(targetNum)，并规定了变化所需的时间(time)和变化间隔(interval)。我们计算出每一步变化的大小(step)，然后使用定时器实现数字的平滑变化，直到达到目标数字为止。

在定时器函数中，我们将数字(num)加上变化的步长(step)，然后将其更新到HTML中显示。当数字达到目标数字(targetNum)时，我们清除定时器(timer)。通过调整变化所需的时间和变化间隔，我们可以控制数字变化的速度和平滑程度。