JS 文字动态变化显示

2019-12-16  本文已影响0人  六摄

<!DOCTYPE html>

<html>

<head>

    <meta charset="UTF-8">

    <title>js实现数字从1动态递增到10</title>

    <script src="js/jquery-1.8.0.js"></script>

</head>

<style>

#span1{

color: red;

font-size: 20px;

}

</style>

<body>

    <span id="span1">0</span>

    <script>

      var num = 0;//开始变量

      var toatl = 10084;//结束变量

      var count = 10;//变化次数

      var add_number = Math.floor(toatl / 10) ;//每次增量

      var remainder = toatl % add_number;//余数

        var t = setInterval(function(){

      num+=add_number ;

      var span1 = document.getElementById("span1");

      span1.innerText = num;

        if( (num+remainder )==toatl){

        span1.innerText = num + remainder;

        clearInterval(t);

        }     

        },100);

</script>

</body>

</html>

上一篇 下一篇

猜你喜欢

热点阅读