javaScript---定时函数

定时函数

        --------------定时函数-------------

定时函数：
setTimeout()
用于在指定的毫秒后调用函数或计算表达式

语法：
setTimeout(“调用的函数名称”，等待的毫秒数)

注：调用一次，执行一次

setInterval()
    可按照指定的周期（以毫秒计）来调用函数或计算表达式，

语法：setInterval(“调用的函数名称”,周期性调用函数之间间隔的秒数)

注：会不停的调用函数，直到函数被关闭或其他方法强制停止，调用一次，按照周期一直运行

————-清除定时函数—————-

（1）clearTimeout() 和 clearInterval()

**clearTimeout() 函数用来清除由setTimeout()函数设置的定时器**

如：clearTimeout( setTimeout()返回的ID值 )

（2）clearInterval()

    用来清除由 setInterval() 函数设置的定时器。

setTimeout() 只执行一次函数，如果多次调用函数，则需要使用setInterval()或者让被调用的函数再次调用setTimeout();

———实例 ————

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <script type="text/javascript">
        var num=0;
        //清除无限循环 变量
        var time1;
        var time2;

        function addNum(){
            document.getElementById("numArea").innerHTML="数字:"+(num++);
        }
        /*无限循环调用  过一秒 就将num 加1 */
        function set1(){
            time1=setInterval("addNum()",1000);
        }
        /*只调用一次， 过一秒 就将num 加1  并运行一次 */
        function set2(){
            time2=setTimeout("addNum()",1000);
        }
        /*清除setInterval  无限循环 函数*/
        function clear1(){
           clearInterval(time1);
        }

        function clear2(){
            clearTimeout(time2);
        }

    </script>
</head>
<body>
<p id="numArea">数字:0</p>
<!--根据后面的毫秒数   一直循环加   无限循环-->
<input type="button" value="setinterval定时" onclick="set1()"/>

<!--根据后面的毫秒数    只运行一次-->
<input type="button" value="setTimeout定时" onclick="set2()"/>

<!--清除方法-->
<input type="button" value="清除 setinterval定时 按钮" onclick="clear1()"/>

<input type="button" value="清除setTimeout 定时 按钮" onclick="clear2()"/>
</body>
</html>

javaScript---定时函数

定时函数

———实例 ————

猜你喜欢