当前位置：网站首页>Write a program to realize the effect of automatic movement of the electronic clock, and provide a button to control whether the electronic clock stops moving.

Write a program to realize the effect of automatic movement of the electronic clock, and provide a button to control whether the electronic clock stops moving.

2022-04-22 23:13:00 【Did you add pepper?】

subject ：

Programming , Realize the effect of automatic movement of the electronic clock, and provide a button to control whether the electronic clock stops moving .

Code interpretation ：
chance_str(n) function ： Format the acquired time , That is, fill zero for one digit less than two digits .
time() function ： Acquisition time , newly build Date Object returns the date and time of the current day . among setTimeout Refresh time per second .
chance() function ： Control buttons 

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<div id="text">
			<p id="time"></p>
			<input type="button" id="bian" onclick="chance()" value=" Pause ">
		</div>
		
		<script>
			// Programming , Realize the effect of automatic movement of electronic clock ,
			// A button is provided to control whether the electronic clock stops moving .
			// Clear procedure steps are required , And annotate the program .
			var run = true;		//  Control whether time moves 
			function chance_str(n){
    		//  Zero padding for two digits 
				if (n<10){
    
					n = "0" + n
				}
				return n
			}
			function time(){
    	//  Acquisition time 
				//console.log(run)
				if(run){
    
					var day = new Date();
					var h = day.getHours();//  Zero padding for two digits 
					h = chance_str(h)
					var m = day.getMinutes();//  Zero padding for two digits 
					m = chance_str(m)
					var s = day.getSeconds();//  Zero padding for two digits 
					s = chance_str(s)
					document.getElementById('time').innerHTML =
					h + ":" + m + ":" + s;  
					setTimeout(time, 1000);		//  Refresh time per second 
				}
			}
			
			time()	//  Call the time function , Initialization interface 
			
			function chance(){
    	//  Control button events 
				if(run == true){
    	//  Suspend operation 
					run = !run;
					document.getElementById('bian').value = " Start ";
				}else{
    		//  Start the operation 
					run = !run;
					document.getElementById('bian').value = " Pause ";
					time()
				}
			}
			
		</script>
	</body>
</html>

Screenshot of operation result ：
Insert picture description here
That's it , A very simple code , Main understanding Date The object is ！！！
The running time is like my time ！ If you let me add a limit , I hope it's ten thousand years ！！！
Insert picture description here

版权声明
本文为[Did you add pepper?]所创，转载请带上原文链接，感谢
https://yzsam.com/2022/04/202204222309549409.html

边栏推荐

猜你喜欢

随机推荐