JavaScript学习笔记之定时器


Posted in Javascript onJanuary 22, 2015

定时器1

用以指定在一段特定的时间后执行某段程序。

setTimeout():

格式:[定时器对象名=] setTimeout(“<表达式>”,毫秒)

功能:执行<表达式>一次。

例子:

<!DOCTYPE html>

<html>

  <head>

    <title>timer1.html</title>

    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">

    <meta http-equiv="description" content="this is my page">

    <meta http-equiv="content-type" content="text/html; charset=UTF-8">

    <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->

    <script type="text/javascript">

     function count()

     {

         setTimeout("alert('执行成功!')",7000);

     }

    </script>

  </head>

  <body>

    <input type="button" value="点击我啊" onclick="count();">

  </body>

</html>

定时器2

以一定的时间为间隔,不断地重复执行表达式。

setInterval():

格式:[定时器对象名=] setInterval(“<表达式>”,毫秒)

功能:重复执行<表达式>,直至窗口、框架被关闭或执行clearInterval。

clearInterval():

格式:clearInterval(定时器对象名)

功能:终止定时器

例子:

<!DOCTYPE html>

<html>

  <head>

    <title>timer2.html</title>

    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">

    <meta http-equiv="description" content="this is my page">

    <meta http-equiv="content-type" content="text/html; charset=UTF-8">

    <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->

    <script type="text/javascript">

    var sec = 0;

    var timer = setInterval("count();",1000);//页面加载的时候即开始计时

     function count()

     {

        document.getElementById("num").innerHTML = sec++;

     }

     function stopCount()

     {

         clearInterval(timer);//停止定时器的运行

     }

    </script>

  </head>

  <body>

    <font color="red" id="num">0</font>

    <input type="button" value="停止" onclick="stopCount();">

  </body>

</html>

以上就是本文的全部内容了,希望大家能够喜欢

Javascript 相关文章推荐
JavaScript学习点滴 call、apply的区别
Oct 22 Javascript
让textarea自动调整大小的js代码
Apr 12 Javascript
javascript抽象工厂模式详细说明
Dec 16 Javascript
基于Bootstrap的UI扩展 StyleBootstrap
Jun 17 Javascript
原生JS实现风箱式demo,并封装了一个运动框架(实例代码)
Jul 22 Javascript
jquery日历插件e-calendar升级版
Nov 10 Javascript
ajax实现加载页面、删除、查看详细信息 bootstrap美化页面!
Mar 14 Javascript
ionic实现下拉刷新载入数据功能
May 11 Javascript
js实现随机点名系统(实例讲解)
Oct 18 Javascript
解决vue-cli webpack打包后加载资源的路径问题
Sep 25 Javascript
vue实现的下拉框功能示例
Jan 29 Javascript
node基于async/await对mysql进行封装
Jun 20 Javascript
JavaScript学习笔记之JS对象
Jan 22 #Javascript
JavaScript学习笔记之JS函数
Jan 22 #Javascript
JavaScript学习笔记之基础语法
Jan 22 #Javascript
详谈jQuery操纵DOM元素属性 attr()和removeAtrr()方法
Jan 22 #Javascript
Angularjs基础知识及示例汇总
Jan 22 #Javascript
jquery使用正则表达式验证email地址的方法
Jan 22 #Javascript
使用jquery操作session方法分享
Jan 22 #Javascript
You might like
PHP实用函数分享之去除多余的0
2015/02/06 PHP
PHP自定义函数格式化json数据示例
2016/09/14 PHP
ThinkPHP使用getlist方法实现数据搜索功能示例
2017/05/08 PHP
ThinkPHP5 的简单搭建和使用详解
2018/11/15 PHP
PHP实现简易计算器功能
2020/08/28 PHP
脚本之家贴图转换+转贴工具用到的js代码超级推荐
2007/04/05 Javascript
jquery 模板的应用示例
2013/11/12 Javascript
window.print打印指定div实例代码
2013/12/13 Javascript
遍历DOM对象内的元素属性示例代码
2014/02/08 Javascript
Webpack 实现 Node.js 代码热替换
2015/10/22 Javascript
基于jQuery实现滚动切换效果
2016/12/02 Javascript
jQuery学习笔记之入门
2016/12/14 Javascript
vue之父子组件间通信实例讲解(props、$ref、$emit)
2018/05/22 Javascript
layui 监听表格复选框选中值的方法
2018/08/15 Javascript
在vue中解决提示警告 for循环报错的方法
2018/09/28 Javascript
JS实现可用滑块滑动的缓动图代码
2019/09/01 Javascript
Vue Object 的变化侦测实现代码
2020/04/15 Javascript
vue实现用户长时间不操作自动退出登录功能的实现代码
2020/07/23 Javascript
Vue 同步异步存值取值实现案例
2020/08/05 Javascript
[33:15]2018DOTA2亚洲邀请赛3月30日 小组赛B组 VP VS Mineski
2018/03/31 DOTA
[51:36]EG vs VP 2018国际邀请赛淘汰赛BO3 第一场 8.24
2018/08/25 DOTA
sqlalchemy对象转dict的示例
2014/04/22 Python
python使用MySQLdb访问mysql数据库的方法
2015/08/03 Python
Python实现购物系统(示例讲解)
2017/09/13 Python
Python 继承,重写,super()调用父类方法操作示例
2019/09/29 Python
瑞士香水购物网站:Parfumcity.ch
2017/01/14 全球购物
Kneipp克奈圃美国官网:德国百年精油配方的传承
2018/02/07 全球购物
伦敦一卡通:The London Pass
2018/11/30 全球购物
全球领先的全景影像品牌:Insta360
2019/08/21 全球购物
什么是唯一索引
2015/07/05 面试题
2015年元旦活动总结
2014/05/09 职场文书
公司开业庆典策划方案
2014/06/04 职场文书
安全保卫工作竞聘材料
2014/08/25 职场文书
Redis安装启动及常见数据类型
2021/04/14 Redis
vue项目打包后路由错误的解决方法
2022/04/13 Vue.js
OpenFeign实现远程调用
2022/08/14 Java/Android