JavaSrcipt---Date

最新推荐文章于 2022-10-15 16:43:56 发布

lkfmiaomiao

最新推荐文章于 2022-10-15 16:43:56 发布

阅读量73

点赞数

本文链接：https://blog.csdn.net/lkfmiaomiao/article/details/100888845

版权

JavaSrcipt—Date
构造函数
Object Array String

var d=new Date();
console.log(d.toLocaleString());

2019年9月16日 下午3:20:44

如何动态显示事时间

<div id="box">2019年9月16日 下午3:14:26</div>
		<script>
			var box=document.getElementById('box');
			setInterval(function(){
				var d=new Date();
			box.innerHTML=d.toLocaleString();
			},1000);
		</script>

数字图片实时显示

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>时钟</title>
		
	</head>
	<body>
		<p id="times">时间</p>
		<img src="img/0.jpg" />
		<img src="img/0.jpg" />
		时
		<img src="img/0.jpg" />
		<img src="img/0.jpg" />
		分
		<img src="img/0.jpg" />
		<img src="img/0.jpg" />
		秒
	<script> 
			window.onload=function()
		{ 
	var times=document.getElementById('times');
			var imgs = document.getElementsByTagName('img');
			
			function Time(){
				var str=""; 
				var d=new Date();
				var h = d.getHours();
				var m = d.getMinutes(); 
				var s = d.getSeconds(); 
				str = toTwo(h)+toTwo(m)+toTwo(s); 
				times.innerHTML=str;
				for ( var i=0; i<str.length; i++ ) 
				{ imgs[i].src = 'img/' + str[i] + '.JPG';
				
				} 
			} 
		
			setInterval(Time,1000);
			Time(); 
		}; 
		
		function toTwo ( n ) {
			return n < 10 ? '0' + n : '' + n;
		}
		
		</script>
	</body>
</html>

效果图：
在这里插入图片描述

lkfmiaomiao

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JavaSrcipt---Date

JavaSrcipt—Date构造函数Object Array Stringvar d=new Date();console.log(d.toLocaleString());2019年9月16日下午3:20:44如何动态显示事时间<div id="box">2019年9月16日下午3:14:26</div> <script> v...
复制链接

扫一扫