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 相关文章推荐
JScript内置对象Array中元素的删除方法
Mar 08 Javascript
Jquery post传递数组方法实现思路及代码
Apr 28 Javascript
javascript生成随机数方法汇总
Nov 12 Javascript
jquery mobile移动端幻灯片滑动切换效果
Apr 15 Javascript
js实现移动端轮播图效果
Dec 09 Javascript
使用ajax的post同步执行(实现方法)
Dec 21 Javascript
vue2 前端搜索实现示例
Feb 26 Javascript
VUE 3D轮播图封装实现方法
Jul 03 Javascript
使用原生js编写一个简单的框选功能方法
May 13 Javascript
原生js实现轮播图特效
May 04 Javascript
js实现表单项的全选、反选及删除操作示例
Jun 05 Javascript
vue操作dom元素的3种方法示例
Sep 20 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 如何向 MySQL 发送数据
2006/10/09 PHP
php获取本地图片文件并生成xml文件输出具体思路
2013/04/27 PHP
jQuery与其它库冲突的解决方法
2010/06/25 Javascript
jQuery+ajax实现顶一下,踩一下效果
2010/07/17 Javascript
prettify 代码高亮着色器google出品
2010/12/28 Javascript
jQuery-Easyui 1.2 实现多层菜单效果的代码
2012/01/13 Javascript
解析javascript 浏览器关闭事件
2013/07/08 Javascript
常用的JavaScript模板引擎介绍
2015/02/28 Javascript
详解JavaScript中循环控制语句的用法
2015/06/03 Javascript
分享两款带遮罩的jQuery弹出框
2015/12/30 Javascript
浅谈Sticky组件的改进实现
2016/03/22 Javascript
JavaScript中文件上传API详解
2016/04/01 Javascript
jquery插件bootstrapValidator表单验证详解
2016/12/15 Javascript
完美实现js选项卡切换效果(二)
2017/03/08 Javascript
JavaScript实现的贝塞尔曲线算法简单示例
2018/01/30 Javascript
layui实现点击按钮给table添加一行
2018/08/10 Javascript
解决Angular2 router.navigate刷新页面的问题
2018/08/31 Javascript
vue element table 表格请求后台排序的方法
2018/09/28 Javascript
详解微信小程序之scroll-view的flex布局问题
2019/01/16 Javascript
Python实现读取txt文件并转换为excel的方法示例
2018/05/17 Python
matplotlib实现热成像图colorbar和极坐标图的方法
2018/12/13 Python
python PIL和CV对 图片的读取,显示,裁剪,保存实现方法
2019/08/07 Python
Python实现PyPDF2处理PDF文件的方法示例
2019/09/25 Python
基于zepto的插件之移动端无缝向上滚动并上下触摸滑动实例代码
2016/12/20 HTML / CSS
amazeui模态框弹出后立马消失并刷新页面
2020/08/19 HTML / CSS
韩国休闲女装品牌网站:ANAIS
2016/08/24 全球购物
远东集团网络工程师面试题
2014/10/20 面试题
Ajxa常见问题都有哪些
2014/03/26 面试题
社会学专业求职信
2014/02/24 职场文书
2014年幼儿园重阳节活动方案
2014/09/16 职场文书
委托书英文
2015/01/28 职场文书
小学国庆节活动总结
2015/03/23 职场文书
2015年小学美术工作总结
2015/05/25 职场文书
浪漫的婚礼主持词
2015/06/30 职场文书
react合成事件与原生事件的相关理解
2021/05/13 Javascript
Android开发之WECHAT微信小程序路由跳转的两种形式
2022/04/12 Java/Android