首页 > 其他分享> > 网页时钟带有清除定时器

网页时钟带有清除定时器

2021-09-14 17:05:24 作者：互联网

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>网页时钟</title>
		
	</head>
	<body>
		<font>当前系统时间是:</font><span id="spanTip"></span>
		<!-- 事件源 -->
		<input type="button" value="清除定时器" onclick="clearTask()" />
	</body>
	<script>
	
		function genDate(){
			//1)创建当前Date对象:拼接当前系统时间
			var date = new Date() ;
			//2)拼接日期字符串
			var dateStr = date.getFullYear()+"-"+(date.getMonth()+1)+"-"+date.getDate()+"&ensp;&ensp;"+
			date.getHours()+":"+date.getMinutes()+":"+date.getSeconds() ;
			//alert(dateStr)
			
			//通过id属性值获取span标签对象
			var spanObject = document.getElementById("spanTip") ;
			
			//设置span标签对象的innerHTML属性: 添加文本内容(可以加入html标签 渲染)
			//innerText属性:只是添加普通文本: 如果添加标签体,不会将标签进行转义
			
			 spanObject.innerHTML = "<h4>"+dateStr +"</h4>";
		}
	
	
		
		 
		 
		 //window对象(可以省略不写)中有网页定时器 
		 //window.setInterval(vCode, iMilliSeconds ): 每经过iMilliSeconds毫秒值重复执行vCode
		 //参数1:任务函数
		 //参数2:毫秒数  
		var taskId = setInterval("genDate()",1000) ;//每经过1000毫秒执行这个任务
		 
		 
		 //window.setTimeout(vCode, iMilliSeconds):经过iMilliSeconds毫秒值后执行一次vCode
		 //参数1:任务函数
		 //参数2:毫秒数  
		 
		 
		 //清除定时器
		 //window.clearInterval(iIntervalID) :参数任务id
		 function clearTask(){
			//alert("触发点击...");
			window.clearInterval(taskId) ;
		 }
		 
		 
		
		
	</script>
</html>

效果图

标签：vCode,定时器,网页,iMilliSeconds,var,毫秒,window,date,时钟
来源： https://blog.csdn.net/zhuanyaolin1497/article/details/120291496