zoukankan      html  css  js  c++  java
  • JS 递归函数的运用

    递归:就是在函数体内调用本函数,说白了,就是函数自己调调用自己。举个例子说明一下,我们常写的打字效果,就是一种递归,

            var oBtn=document.getElementById('btn');
            var oTex=document.getElementById('tex');
            var oBox=document.getElementById('box');
    
            oBtn.onclick=function(){
                var value=oTex.value;
                if(!value){
                    alert('请输入内容');
                    return;
                };
    
                var n=0;
                setTimeout(fn,rnd(60,500));
                
                function fn(){
                    n++;
                    oBox.innerHTML=value.substring(0,n)+'<span>_</span>';
                    if(n==value.length){
                        oBox.innerHTML=value.substring(0,n);
                    }else{
                        setTimeout(fn,rnd(60,500));  //这里用到了递归
                    }
    
                }
            }
        };
    
        function rnd(n,m){
            return parseInt(Math.random()*(m-n+1)+n);
        }    

    html代码:

    <input type="button" value="aa" id="btn">
    <textarea id="tex"></textarea>
    <div id="box" style="500px;border:1px solid #000;height:500px;"></div>

    大家可以试试看哦!

    如果问题,欢迎大家及时指点,一同交流,共同提高
  • 相关阅读:
    webpack基本使用
    vue-路由-显示名称
    vue-父组件和路由
    vue-路由
    vue-父子组件和ref
    vue-组件
    go-面向对象编程(上)
    JavaScript的历史
    vue-列表动画
    钩子函数实现小球弹落
  • 原文地址:https://www.cnblogs.com/wujidns/p/4431968.html
Copyright © 2011-2022 走看看