javascript间隔定时器(延时定时器)学习 间隔调用和延时调用


Posted in Javascript onJanuary 13, 2014

用setInterval方法可以以指定的间隔实现循环调用函数,直到clearInterval方法取消循环

用clearInterval方法取消循环时,必须将setInterval方法的调用赋值给一个变量,然后clearInterval方法引用该变量。

<script type="text/javascript">
    var n = 0;
    function print(){
        document.writeln(n);        if(n==1000){
        window.clearInterval(s);
        }    
        n++;
    }
     var s = window.setInterval(print, 10);
</script>

用setTimeout和clearTimeout完成延时调用,在指定的延迟时间之后运行指定函数,只执行一次。clearTimeout的用法同clearInterval方法的用法相同。

<script type="text/javascript">
    function printTime(){
        var time = new Date();
        var year = time.getFullYear();
        var month = (time.getMonth())+1;
        var daynum = time.getDay();
        var hour = time.getHours();
        var min = time.getMinutes();
        var sec = time.getSeconds();
        var da = time.getDate();
        var daystr;
        switch(daynum){
        case 0: daystr="星期日";
            break;
        case 1: daystr="星期一";
            break;
        case 2: daystr="星期二";
            break;
        case 3: daystr="星期三";
            break;
        case 4: daystr="星期四";
            break;
        case 5: daystr="星期五";
            break;
        case 6: daystr="星期六";
            break;
        default: daystr="";
        }
        var str = year+"年"+month+"月"+da+"日  "+daystr+" "+hour+": "+min+": "+sec;
        document.getElementById("t").innerHTML = str;
        window.setTimeout(printTime, 1000);
    }
</script>
<body onload="printTime()">
<br/>
<div id="t"></div>
</body>
Javascript 相关文章推荐
JavaScript版代码高亮
Jun 26 Javascript
JavaScript浏览器选项卡效果
Aug 25 Javascript
自己写了一个展开和收起的多更能型的js效果
Mar 05 Javascript
关于jquery input textare 事件绑定及用法学习
Apr 03 Javascript
jquery的父子兄弟节点查找示例代码
Mar 03 Javascript
深入剖析JavaScript:Object类型
May 10 Javascript
JavaScript中String对象的方法介绍
Jan 04 Javascript
Bootstrap模态框插入视频的实现代码
Jun 25 Javascript
Vue2.0父组件与子组件之间的事件发射与接收实例代码
Sep 19 Javascript
Vue组件开发技巧总结
Mar 04 Javascript
webpack+vue-cil 中proxyTable配置接口地址代理操作
Jul 18 Javascript
Vue检测屏幕变化来改变不同的charts样式实例
Oct 26 Javascript
parentElement,srcElement的使用小结
Jan 13 #Javascript
javaScript中的this示例学习详解及工作原理
Jan 13 #Javascript
JS 日期比较大小的简单实例
Jan 13 #Javascript
JS之Date对象和获取系统当前时间详解
Jan 13 #Javascript
JS OffsetParent属性深入解析
Jan 13 #Javascript
JavaScript网页定位详解
Jan 13 #Javascript
js菜单点击显示或隐藏效果的简单实例
Jan 13 #Javascript
You might like
用php实现的下载css文件中的图片的代码
2010/02/08 PHP
PHP编码转换函数 自动转换字符集支持数组转换
2012/12/16 PHP
phpmyadmin config.inc.php配置示例
2013/08/27 PHP
用javascript实现的支持lrc歌词的播放器
2007/05/17 Javascript
Javascript中Eval函数的使用说明
2008/10/11 Javascript
javascript radio 联动效果
2009/03/04 Javascript
对采用动态原型方式无法展示继承机制得思考
2009/12/04 Javascript
javascript学习笔记(十) js对象 继承
2012/06/19 Javascript
基于jquery的图片轮播 tab切换组件
2012/07/19 Javascript
Array.prototype.concat不是通用方法反驳[译]
2012/09/20 Javascript
利用node.js搭建简单web服务器的方法教程
2017/02/20 Javascript
整理关于Bootstrap表单的慕课笔记
2017/03/29 Javascript
jQuery实现的简单日历组件定义与用法示例
2018/12/24 jQuery
layerui代码控制tab选项卡,添加,关闭的实例
2019/09/04 Javascript
Python多线程编程(六):可重入锁RLock
2015/04/05 Python
Python实现的简单排列组合算法示例
2018/07/04 Python
Python3删除排序数组中重复项的方法分析
2019/01/31 Python
使用python的turtle函数绘制一个滑稽表情
2020/02/28 Python
基于python调用jenkins-cli实现快速发布
2020/08/14 Python
css3 盒模型以及box-sizing属性全面了解
2016/09/20 HTML / CSS
Casetify官网:自制专属手机壳、iPad护壳和Apple Watch手表带
2018/05/09 全球购物
软件工程师岗位职责
2013/11/16 职场文书
实习单位推荐信范文
2013/11/27 职场文书
面料业务员岗位职责
2013/12/26 职场文书
展会邀请函范文
2014/01/26 职场文书
大学毕业寄语大全
2014/04/10 职场文书
2015年酒店客房部工作总结
2015/04/25 职场文书
考试没考好检讨书
2015/05/06 职场文书
刑事附带民事上诉状
2015/05/23 职场文书
小学生手册家长意见
2015/06/03 职场文书
开学第一周总结
2015/07/16 职场文书
高三教师工作总结2015
2015/07/21 职场文书
高中团支书竞选稿
2015/11/21 职场文书
2016党员干部廉政准则学习心得体会
2016/01/20 职场文书
2019年大学推荐信
2019/06/24 职场文书
html5+实现plus.io进行拍照和图片等获取
2022/06/01 HTML / CSS