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 相关文章推荐
用Javscript实现表单复选框的全选功能
May 25 Javascript
javascript 写的一个简单的timer
Jul 30 Javascript
javascript获得CheckBoxList选中的数量
Oct 27 Javascript
node.js中的fs.open方法使用说明
Dec 17 Javascript
javascript实现简单的进度条
Jul 02 Javascript
JS实现超简单的鼠标拖动效果
Nov 02 Javascript
理解JS事件循环
Jan 07 Javascript
第四篇Bootstrap网格系统偏移列和嵌套列
Jun 21 Javascript
学习Angular中作用域需要注意的坑
Aug 17 Javascript
jQuery快速高效制作网页交互特效
Feb 24 Javascript
vue  directive定义全局和局部指令及指令简写
Nov 20 Javascript
小程序实现左滑删除的效果的实例代码
Oct 19 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
《星际争霸2》终章已出 RTS时代宣告终结
2017/02/07 星际争霸
php生成EXCEL的东东
2006/10/09 PHP
怎样给PHP源代码加密?PHP二进制加密与解密的解决办法
2013/04/22 PHP
YII框架模块化处理操作示例
2019/04/26 PHP
laravel 自定义常量的两种方案
2019/10/14 PHP
PHP设计模式(四)原型模式Prototype实例详解【创建型】
2020/05/02 PHP
[对联广告] JS脚本类
2006/08/27 Javascript
通过修改referer下载文件的方法
2008/05/11 Javascript
JavaScript Event学习第二章 Event浏览器兼容性
2010/02/07 Javascript
IE6、IE7中获取Button元素的值的bug说明
2011/08/28 Javascript
JavaScript ECMA-262-3 深入解析.第三章.this
2011/09/28 Javascript
web网页按比例显示图片实现原理及js代码
2013/08/09 Javascript
浅谈Javascript 执行顺序
2013/12/18 Javascript
JS实现的新浪微博大厅文字内容滚动效果代码
2015/11/05 Javascript
React Form组件的实现封装杂谈
2018/05/07 Javascript
NodeJS服务器实现gzip压缩的示例代码
2018/10/12 NodeJs
ES6 Map结构的应用实例分析
2019/06/26 Javascript
编写更好的JavaScript条件式和匹配条件的技巧(小结)
2019/06/27 Javascript
基于axios 的responseType类型的设置方法
2019/10/29 Javascript
jquery实现吸顶导航效果
2020/01/08 jQuery
在vue中使用Echarts利用watch做动态数据渲染操作
2020/07/20 Javascript
JavaScript实现鼠标经过表格某行时此行变色
2020/11/20 Javascript
vue项目如何监听localStorage或sessionStorage的变化
2021/01/04 Vue.js
[03:42]2014DOTA2西雅图国际邀请赛 Navi战队巡礼
2014/07/07 DOTA
python集合类型用法分析
2015/04/08 Python
Python中为什么要用self探讨
2015/04/14 Python
python3处理含有中文的url方法
2018/05/10 Python
对python 匹配字符串开头和结尾的方法详解
2018/10/27 Python
Python中extend和append的区别讲解
2019/01/24 Python
django drf框架中的user验证以及JWT拓展的介绍
2019/08/12 Python
canvas像素画板的实现代码
2018/11/21 HTML / CSS
意大利在线高尔夫商店:Online Golf
2021/03/09 全球购物
2015年幼儿园毕业感言
2014/02/12 职场文书
医院感染管理制度
2015/08/05 职场文书
银行工作心得体会范文
2016/01/23 职场文书
护士爱岗敬业心得体会
2016/01/25 职场文书