SOURCE

console 命令行工具 X clear

                    
>
console
function NumAutoPlusAnimation(start = 0, end = 1e2) {
    let step = (end - start) / 30;
    let count = start, initial = 0;
    let timer = setInterval(() => {
        count = count + step;
        if (count >= end) {
            clearInterval(timer)
            count = end
        }
        let t = count.toFixed(2)
        initial = t
        document.getElementById('userNum').innerHTML = initial
    }, 3e1)
}
document.getElementById('userRun').addEventListener('click', () => {
    NumAutoPlusAnimation()
})

window.onload = function () {

    var options = {
        useEasing: true,  // 过渡动画效果 
        useGrouping: true, // 千分位效果 如 1234 => 1,234 
        separator: ",", //  使用千分位时分割符号 
        decimal: ".", // 小数位分割符号
        prefix: '*',  // 前置符号
        suffix: ""  //  后置符号 可汉字 
    }
    // new CountUp(target,startVal,endVal,decimals,dutation,options)
    /*
        target dom节点 , 
        startVal 初始值 ,
        endVal 结束值 ,
        decimals 小数位数 ,
        dutation 过渡时长 ,
        options 初始化参数
    */
    var num1 = new CountUp('num1', 0, 2e3, 2),
        num2 = new CountUp('num2', 1e2, 3e3)

    function start  () {
        console.log('start')
        num1.start()
        num2.start()
    }
    function pause (){
        console.log('pause')
        num1.pauseResume()
    }
    function reset ()  {
        console.log('reset')
        num1.reset()
    }
    function updata () {
        num1.update(888)
    }
}
<p id="userNum"></p> <button id="userRun"> js 手写方式 </button>

<div class="flex">
    <p id="num1"></p>
    <p id="num2"></p>
    <button onclick="start()">开始+</button>
    <button onclick="reset()">重置 </button>
</div>

本项目引用的自定义外部资源