简单的JS计时器

SYEYEE

于 2021-01-21 21:31:08 发布

阅读量79

点赞数

文章标签： javascript html

本文链接：https://blog.csdn.net/SYEYEE/article/details/112972749

版权

<!DOCTYPE html><!DOCTYPE html>
<html lang ="en">
<head>
	<meta charset="UTF-8" >
	<title>JS计时器</title>
	<style type="text/css">
		input{
			border: 1px solid rgba(0,0,0,0.8);
			text-align: right;
			font-size: 30px;
			font-weight: bold;
		}


	</style>

</head>

<body>
		<h1 align="center">计时器</h1>
		minutes:<input type="text" value="0">
		seconds:<input type="text" value="0">

		<script type="text/javascript">

			var minutesNode = document.getElementsByTagName('input')[0];
			var secondsNode = document.getElementsByTagName('input')[1];

			var minutes = 0,
				seconds = 0;

			var timer = setInterval(function(){

					seconds ++;


					if(seconds == 60) {
						seconds = 0;
						minutes ++;
					}

					secondsNode.value = seconds;
					minutesNode.value = minutes;
					if(minutes == 10){
						clearInterval(timer);
					}
				},1000)
		

			
</script>

</body>
</html>

SYEYEE

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
简单的JS计时器

<!DOCTYPE html><!DOCTYPE html><html lang ="en"><head> <meta charset="UTF-8" > <title>JS计时器</title> <style type="text/css"> input{ border: 1px solid rgba(0,0,0,0.8); text-align: right; font-si.
复制链接

扫一扫