各种样式电子表

Html

Css

简易电子表.现在时间是


使用Date() , setTimeout() , toLocaleDateString() , toLocaleTimeString()



    1:
    1:
    1


使用Date() , setTimeout() , getHours() , getMinutes() , getSeconds() 


使用: 同上例

 #day {
	font-size:2em;
}
#time {
	font-size:5em;
	font-family:'Microsoft YaHei';
}
.f {
	font-size:7em;
}
#hdiv,#mdiv,#sdiv {
	font-size:8em;
	font-family:'Quartz Regular';
	color:#fff;
	background-color:#000;
}
#iWatch {
	width:300px;
	text-align:center;
	line-height:60px;
	font-size:40px;
	font-weight:bold;
	border:2px solid #333;
	background:#abcdef;
}

//表1
 timer();

function timer() {
     var d = document.getElementById('day');
     var t = document.getElementById('time');
     var n = new Date();
     setTimeout(timer, 1000);
     d.innerHTML = n.toLocaleDateString();
     t.innerHTML = n.toLocaleTimeString();
 }

//表2
 now();

function now() {
     var hdiv = document.getElementById('hdiv');
     var mdiv = document.getElementById('mdiv');
     var sdiv = document.getElementById('sdiv');

setTimeout(now, 1000);
     hdiv.innerHTML = h;
     mdiv.innerHTML = m;
     sdiv.innerHTML = s;
 }

//表3
 setInterval(run, 1000);
 run();

function run() {
     //实例化 Date
     var date = new Date();
     //获取时分秒
     var h = date.getHours();
     var i = date.getMinutes();
     var s = date.getSeconds();
     //处理
     h = (h < 10) ? '0' + h : h;
     i = (i < 10) ? '0' + i : i;
     s = (s < 10) ? '0' + s : s;
     //写入表
     document.getElementById('iWatch').innerHTML = h + ':' + i + ':' + s;
 }

↑上面代码改变，会自动显示代码结果 jQuery调用版本：1.11.3

立即下载

各种样式电子表



代码描述：用Javript 内置函数Date函数定时器完成

使用javascript 初学者借鉴

0

最新

发表评论全部评论

暂时没有评论！

登录后才可以评论

30秒后在评论吧!

PROMULGATOR

无痕

相关代码

简易电子表.现在时间是

各种样式电子表

最新