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 相关文章推荐
jQuery布局插件UI Layout简介及使用方法
Apr 03 Javascript
jQuery之按钮组件的深入解析
Jun 19 Javascript
仿百度的关键词匹配搜索示例
Sep 25 Javascript
showModelDialog弹出文件下载窗口的使用示例
Nov 19 Javascript
js 数值转换为3位逗号分隔的示例代码
Feb 19 Javascript
JS实现三个层重叠点击互相切换的方法
Oct 06 Javascript
javascript新闻跑马灯实例代码
Jul 29 Javascript
浅谈jQuery animate easing的具体使用方法(推荐)
Jun 17 Javascript
一句jQuery代码实现返回顶部效果(简单实用)
Dec 28 Javascript
js 两个日期比较相差多少天的实例
Oct 19 Javascript
使用use注册Vue全局组件和全局指令的方法
Mar 08 Javascript
vue项目打包为APP,静态资源正常显示,但API请求不到数据的操作
Sep 12 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
深入探讨<br />和 \r\n两者有什么区别??
2013/06/05 PHP
set_exception_handler函数在ThinkPHP中的用法
2014/10/31 PHP
php中ob_flush函数和flush函数用法分析
2015/03/18 PHP
PHP PDOStatement::execute讲解
2019/01/31 PHP
COM中获取JavaScript数组大小的代码
2009/11/22 Javascript
Javascript 实用小技巧
2010/04/07 Javascript
js和jquery批量绑定事件传参数一(新猪猪原创)
2010/06/23 Javascript
Javascript实现真实字符串剩余字数提示的实例代码
2013/10/22 Javascript
jQuery 中DOM 操作详解
2015/01/13 Javascript
AngularJS中的JSONP实例解析
2016/12/01 Javascript
BootStrap fileinput.js文件上传组件实例代码
2017/02/20 Javascript
JavaScript面向对象精要(下部)
2017/09/12 Javascript
JS解决IOS中拍照图片预览旋转90度BUG的问题
2017/09/13 Javascript
使用JS实现气泡跟随鼠标移动的动画效果
2017/09/16 Javascript
对vue2.0中.vue文件页面跳转之.$router.push的用法详解
2018/08/24 Javascript
JS编写兼容IE6,7,8浏览器无缝自动轮播
2018/10/12 Javascript
JS中getElementsByClassName与classList兼容性问题解决方案分析
2019/08/07 Javascript
JQuery常用简单动画操作方法回顾与总结
2019/12/07 jQuery
Python实现类继承实例
2014/07/04 Python
python进阶教程之模块(module)介绍
2014/08/30 Python
Python3 log10()函数简单用法
2019/02/19 Python
python中对_init_的理解及实例解析
2019/10/11 Python
解决python Jupyter不能导入外部包问题
2020/04/15 Python
使用CSS3的font-face字体嵌入样式的方法讲解
2016/05/13 HTML / CSS
HTML5+lufylegend实现游戏中的卷轴
2016/02/29 HTML / CSS
印尼太阳百货公司网站:Matahari
2018/02/04 全球购物
送给他或她的礼物:FUN.com
2018/08/17 全球购物
C++:局部变量能否和全局变量重名
2014/03/03 面试题
财务经理的岗位职责
2013/12/17 职场文书
物理专业本科生自荐信
2014/01/30 职场文书
机械专业技术员求职信
2014/06/14 职场文书
安全生产警示教育活动总结
2015/05/09 职场文书
2015年学校总务处工作总结
2015/05/19 职场文书
护士爱岗敬业心得体会
2016/01/25 职场文书
Golang 空map和未初始化map的注意事项说明
2021/04/29 Golang
「魔导具师妲莉亚永不妥协~从今天开始的自由职人生活~」1、2卷发售宣传CM公开
2022/03/21 日漫