JavaScript编写了一个计时器

最新推荐文章于 2023-07-24 10:37:30 发布

于大大大洋

最新推荐文章于 2023-07-24 10:37:30 发布

阅读量5.4k

点赞数 2

分类专栏： JavaScript 文章标签： js原创 js计时器学习交流

本文链接：https://blog.csdn.net/arrowzz/article/details/38458737

版权

JavaScript 专栏收录该内容

28 篇文章 0 订阅

订阅专栏

初学JavaScript，用JavaScript编写了一个计时器。

设计思想：

1、借助于Date()对象，来不断获取时间点；

2、然后用两次时间点的毫秒数相减，算出时间差；

3、累加时间差，这样就能把计时精确。

ps：

没在网上看到有这种方法，一般都是用的setinterval，编程语言自带的延时，时间控制都有比较大的误差；

所以用系统时间相减的方法控制精准，并以本例显示三位毫秒的数字印证准确度，设置的是100毫秒，而Js本身会有误差；

这个程序可以避免不精确的问题。

本例互相交流用，并迫切希望得到的读者的想法及建议。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script type="text/javascript">
			var tFlag = 0;
			var tPass = 0;
			function timer(id) {
				if (tFlag != 0) {
					var tNew = new Date().getTime();
					tPass = tPass + (tNew - tFlag);
					tFlag = tNew;

				} else {
					tFlag = new Date().getTime();
				}
				setTimeout("timer('" + id + "')", 100);
				var ml = tPass % 1000;
				var sc = Math.floor((tPass / 1000) % 60);
				var mi = Math.floor((tPass / 1000 / 60) % 60);
				var hr = Math.floor((tPass / 1000 / 60 / 60) % 24);
				var dy = Math.floor(tPass / 1000 / 60 / 60 / 24);
				var info = dy + "天" + hr + "时" + mi + "分" + sc + "秒" + ml + "毫秒";
				document.getElementById(id).innerHTML = info;
			}
		</script>
	</head>
	<body>
		<button type="button" οnclick="timer('ptime')">
			开始计时
		</button>
		<p id="ptime"></p>
	</body>
</html>

于大大大洋

关注

2
点赞
踩
5

收藏

觉得还不错? 一键收藏
打赏
2
评论
JavaScript编写了一个计时器

初学JavaScript，用JavaScript编写了一个计时器。设计思想：1、借助于Date()对象，来不断获取时间点；2、然后用两次时间点的毫秒数相减，算出时间差；3、累加时间差，这样就能把计时精确。ps：没在网上看到有这种方法，一般都是用的setinterval，编程语言自带的延时，时间控制都有比较大的误差；所以用系统时间相减的方法控制精准，并以本例显示三位毫秒的数字印证准确度，设置的是100毫秒，而Js本身会有误差；这个程序可以避免不精确的问题。本例互相交流用，并迫切希望得到的
复制链接

扫一扫