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>

大家可以试试看哦!

如果问题,欢迎大家及时指点,一同交流,共同提高
原文地址:https://www.cnblogs.com/wujidns/p/4431968.html