js字体叠加效果

刚好最近做个pc端官网项目，内容展示不是很丰富，于是就想着给加点效果，就在数字展示上面做了手脚

<label id="num1" data-to="3000" data-speed="1500">0label><label>+label>

numAdd("num1");
//数字叠加效果
function numAdd(dom) {
    const numD = document.getElementById(dom)
    var num = numD.getAttribute("data-to")
    var time = numD.getAttribute("data-speed")
    var numTime = num / time
    var i = 1
    var timer = setInterval(function () {
        if (i == num) {
            clearInterval(timer)
        }
        //如果大于500每次加10，否则每次加1
        if(num-numD.innerHTML>300){
            i+=10;
            numD.innerHTML = i++;
        }else{
            numD.innerHTML = i++;
        }
        
    }, numTime)
}

这只是简单的例子而已，实际上还有很多可以拓展的。可以根据具体业务进行拓展。