javascript入门笔记7-计时器
计时器
语法：
setInterval(代码，交互时间)
参数说明：
代码：要调用的函数或要执行的代码串。
交互时间：周期性执行或调用表达式之间的时间间隔，以毫秒计（1s=1000ms）。
例子：
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>定时器</title>
<script type="text/javascript">
var attime;
function clock(){
var time=new Date();
attime= time.getHours()+':'+time.getMinutes()+':'+time.getSeconds();;
document.getElementById("clock").value = attime;
}
var timer = setInterval(clock,1000);
</script>
</head>
<body>
<form>
<input type="text" id="clock" size="50" />
</form>
</body>
</html>
取消计时器
语法：
clearInterval(id_of_setInterval)
参数说明：
id_of_setInterval：由 setInterval() 返回的 ID 值。
任务：
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>计时器</title>
<script type="text/javascript">
function clock(){
var time=new Date();
document.getElementById("clock").value = time;
}
var i=setInterval("clock()",100);
</script>
</head>
<body>
<form>
<input type="text" id="clock" size="50" />
<input type="button" value="Stop" onclick="clearInterval(i)" />
</form>
</body>
</html>
延时计时器 setTimeout()
setTimeout()计时器，在载入后延迟指定时间后,去执行一次表达式,仅执行一次。
语法：
setTimeout(代码,延迟时间);
例子：
<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript">
function tinfo(){
var t=setTimeout("alert('Hello!')",5000);
}
</script>
</head>
<body>
<form>
<input type="button" value="start" onClick="tinfo()">
</form>
</body>
</html>
要创建一个运行于无穷循环中的计数器，我们需要编写一个函数来调用其自身。在下面的代码，当按钮被点击后，输入域便从0开始计数。
<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript">
var num=0;
function numCount(){
document.getElementById('txt').value=num;
num=num+1;
setTimeout("numCount()",1000);
}
</script>
</head>
<body>
<form>
<input type="text" id="txt" />
<input type="button" value="Start" onClick="numCount()" />
</form>
</body>
</html>取消计时器clearTimeout()
语法：
clearTimeout(id_of_setTimeout)
参数说明：
id_of_setTimeout：由 setTimeout() 返回的 ID 值。该值标识要取消的延迟执行代码块。
列子
<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript">
var num=0,i;
function timedCount(){
document.getElementById('txt').value=num;
num=num+1;
i=setTimeout(timedCount,1000);
}
setTimeout(timedCount,1000);
function stopCount(){
clearTimeout(i);
}
</script>
</head>
<body>
<form>
<input type="text" id="txt">
<input type="button" value="Stop" onClick="stopCount()">
</form>
</body>
</html>javascript入门笔记7-计时器的更多相关文章
- JavaScript基础——JavaScript入门(笔记)
JavaScript入门(笔记) JavaScript是一种轻量级.解释型的Web开发语言,该语言系统不是很庞杂,简单易学.由于所有现代浏览器都已嵌入JavaScript引擎,JavaScript源代 ...
- JavaScript入门笔记
第一章 JavaScript语法 1.1 初识JavaScript 1.3 数据类型 1.4 string和boolean类型 1.5 算数操作符 第二章 JavaScript流程控制语句 2.1 循 ...
- javascript入门笔记3-dom
1.通过ID获取元素 document.getElementById("id") <!DOCTYPE HTML> <html> <head> & ...
- JAVAscript学习笔记 js计时器与倒计时 第六节 （原创） 参考js使用表
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- JavaScript 入门笔记
JavaScript 1.JS和DOM的关系 浏览器有渲染html代码的功能,把html源码在内存里形成一个DOM对象,就是文档对象 浏览器内部有一个JS的解释器/执行/引擎,如chrome用v8 ...
- JavaScript入门笔记（一）
JavaScipt 2.1 javascript的组成部分 ECMAScript: 它是整个 javascript 的核心,包含(基本语法.变量.关键字.保留字.数据类型.语句.函数等等)DOM:文档 ...
- javascript入门笔记9-认识DOM
认识DOM 文档对象模型DOM(Document Object Model)定义访问和处理HTML文档的标准方法.DOM 将HTML文档呈现为带有元素.属性和文本的树结构(节点树). 将HTML代码分 ...
- javascript入门笔记8-window对象
History 对象 history对象记录了用户曾经浏览过的页面(URL),并可以实现浏览器前进与后退相似导航的功能. 注意:从窗口被打开的那一刻开始记录,每个浏览器窗口.每个标签页乃至每个框架,都 ...
- javascript入门笔记6-内置对象
1.Date 日期对象 日期对象可以储存任意一个日期,并且可以精确到毫秒数(1/1000 秒). 定义一个时间对象 : var Udate=new Date(); 注意:使用关键字new,Date() ...
随机推荐
- 多个ajax请求时控制执行顺序或全部执行后的操作
1.当确保执行顺序时 (1)请求加async: false,,这样所有的ajax就会同步执行,请求顺序就是代码顺序: (2)$.when 确保所有异步的ajax请求完毕时 $.when($.aja ...
- PlayMaker Get Parent 拿到父物体
这里是拿到自己的父物体,然后存储到Parent这个GameObject变量里. 然后在Parent那个位置生成一个Coin,也就是在父物体那生成一个Coin.
- 【Linux】tcp缓冲区大小的默认值、最大值
Author:阿冬哥 Created:2013-4-17 Blog:http://blog.csdn.net/c359719435/ Copyright 2013 阿冬哥 http://blog.cs ...
- Java基础10-循日历制作
编写过程:先指定固定的年份来输出指定月份的日历 /*计算1900年1月1日到2018年11月1日一共有多少天 计算月份 对7进行取模,结果就为星期几 */ import java.util.Scann ...
- java实现两个整数相除保留一位小数
//整数相除 保留一位小数 public static String division(int a ,int b){ String result = ""; float num = ...
- 文件选择之OpenFileDialog控件
OpenFileDialog控件主要用于选择要打开的文件,在使用时可以在属性面变中设置属性,也可在代码中设置其属性 OpenFileDialog控件的属性 InitialDirectory 对话框的初 ...
- hystrix应用介绍（四）
前几章已经讲了hystrix的应用场景,以及如何使用,本章我们针对如何进行hystrix参数配置做一些分析 //异步的执行 @HystrixCommand(groupKey = "testK ...
- 如何在eclipse查看jdk源码(src.zip)
在eclipse编写代码的过程中,有时候想点进去看看jdk的源码,了解下里面具体的实现.在没有任何配置的情况下,应该是看不到源码的. 其实只需要把jdk安装目录下的src.zip压缩包添加到eclip ...
- java 模拟实现消费者和生产者问题
题目要求 用java代码模拟实现:一个人不断往箱子里放苹果,另一个人不断从箱子里取苹果,箱子只能放5个苹果,苹果数量无限.要求不使用java.util.concurrent包中的类. 思路 这道题主要 ...
- spring笔记4-事务管理
一.xml配置文件形式 通过转账案例,学习事务管理 1.建立数据库 2.编写entity package huguangqin.com.cnblogs.entity; public class Use ...