• 技术文章 >web前端 >js教程

    JavaScript setTimeout和setInterval的使用方法 说明_javascript技巧

    2016-05-16 18:31:22原创746
    不同的是setInterval会每隔指定的时间段就执行一次代码,具有重复性。而setTimeout只会调用后执行一次。
    下面通过函数的建立和函的自动删除来深刻理解两个函数;
    1.函数的建立
    setTimeOut的建立:
    复制代码 代码如下:

    showTime();
    function showTime()
    {
    var today = new Date();
    alert("The time is: " + today.toString());
    setTimeout("showTime()", 5000);
    }

    调用函数后五秒钟才会执行一次showtime函数
    setInterval的建立
    复制代码 代码如下:

    setInterval("showTime()", 5000);
    function showTime()
    {
    var today = new Date();
    alert("The time is: " + today.toString());
    }

    总结:貌似两个函数的结果相似,其实不然第二个函数会反复的报时,直到该网页被关闭。
    两个函数的消除:
    setTimeout的消除使用
    clearTimeout()函数;调用的实例:
    复制代码 代码如下:

    var timeoutProcess = setTimeout("alert('GOAL!')", 3000);
    var stopGoalLink = document.getElementById("stopGoalLink");
    attachEventListener(stopGoalLink, "click", stopGoal, false);//加入事件函数,参数为(目标;事件;调用的函数;是否冒泡)
    function stopGoal()
    {
    clearTimeout(timeoutProcess);
    }

    setInterval的消除
    复制代码 代码如下:

    var timeoutProcess = setTimeout("alert('GOAL!')", 3000);
    var stopGoalLink = document.getElementById("stopGoalLink");
    attachEventListener(stopGoalLink, "click", stopGoal, false);//加入事件函数,参数为(目标;事件;调用的函数;是否冒泡)
    function stopGoal()
    {
    clearInterval(timeoutProcess);
    }
    声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。
    专题推荐:setTimeout setInterval
    上一篇:Jquery 1.42 checkbox 全选和反选代码_jquery 下一篇:自己动手写 PHP MVC 框架(40节精讲/巨细/新人进阶必看)

    相关文章推荐

    • 一文浅析node中如何使用消息队列• 【翻译】使用自定义hooks对React组件进行重构• 一文详解Node中express的身份认证• Angular学习之聊聊生命周期• 一文带你了解node中的的模块系统
    1/1

    PHP中文网