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学习阶段性总结(2)--(X)HTML学习
Feb 03 Javascript
TimergliderJS 一个基于jQuery的时间轴插件
Dec 07 Javascript
关于js new Date() 出现NaN 的分析
Oct 23 Javascript
node.js中的fs.chown方法使用说明
Dec 16 Javascript
JavaScript必知必会(三) String .的方法来自何方
Jun 08 Javascript
Vue.js每天必学之过滤器与自定义过滤器
Sep 07 Javascript
js实现自动图片轮播代码
Mar 22 Javascript
AngularJS点击添加样式、点击变色设置的实例代码
Jul 27 Javascript
使用webpack-dev-server处理跨域请求的方法
Apr 18 Javascript
angular6.0开发教程之如何安装angular6.0框架
Jun 29 Javascript
js canvas实现俄罗斯方块
Oct 11 Javascript
JS前端使用Canvas快速实现手势解锁特效
Sep 23 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里的JS打印函数
2006/10/09 PHP
PHP 判断常量,变量和函数是否存在
2009/04/26 PHP
PHP 金额数字转换成英文
2010/05/06 PHP
Thinkphp搜索时首页分页和搜索页保持条件分页的方法
2014/12/05 PHP
浅谈php处理后端&amp;接口访问超时的解决方法
2016/10/29 PHP
PHP用户注册邮件激活账户的实现代码
2017/05/31 PHP
设定php简写功能的方法
2019/11/28 PHP
JQuery中阻止事件冒泡几种方式及其区别介绍
2014/01/15 Javascript
jQuery之选项卡的简单实现
2014/02/28 Javascript
JavaScript分析、压缩工具JavaScript Analyser
2014/12/31 Javascript
Javascript实现的Map集合工具类完整实例
2015/07/31 Javascript
JavaScript阻止回车提交表单的方法
2015/12/30 Javascript
React实现双向绑定示例代码
2016/09/19 Javascript
vue-ajax小封装实例
2017/09/18 Javascript
VueAwesomeSwiper在VUE中的使用以及遇到的一些问题
2018/01/11 Javascript
vue2.0 路由不显示router-view的解决方法
2018/03/06 Javascript
微信小程序项目总结之记账小程序功能的实现(包括后端)
2019/08/20 Javascript
layui 实现加载动画以及非真实加载进度的方法
2019/09/23 Javascript
详解如何使用React Hooks请求数据并渲染
2020/10/18 Javascript
vue实现简单的登录弹出框
2020/10/26 Javascript
vantUI 获得piker选中值的自定义ID操作
2020/11/04 Javascript
Python操作SQLite简明教程
2014/07/10 Python
pandas DataFrame实现几列数据合并成为新的一列方法
2018/06/08 Python
python 中文件输入输出及os模块对文件系统的操作方法
2018/08/27 Python
pytorch实现focal loss的两种方式小结
2020/01/02 Python
css3 中translate和transition的使用方法
2020/03/26 HTML / CSS
Html5原生拖拽相关事件简介以及基础实现
2020/11/19 HTML / CSS
英国领先的珍珠首饰品牌:Orchira
2016/09/11 全球购物
英国HYPE双肩包官网:英国本土时尚潮牌
2018/09/26 全球购物
Pharmacy Online中文直邮网站:澳洲大型药房
2020/06/27 全球购物
公司活动策划方案
2014/01/13 职场文书
经济管理专业求职信
2014/06/09 职场文书
公共机构节能宣传周活动总结
2014/07/09 职场文书
住宿生擅自离校检讨书
2014/09/22 职场文书
熟背这些句子,让您的英语口语突飞猛进(135句)
2019/09/06 职场文书
Elasticsearch 批量操作
2022/04/19 Python