您的位置：首页 > Web前端 > JavaScript

JS实现时钟功能

2017-06-01 20:03 465 查看

时钟功能

功能描述

以前前段的JS代码有的是扒的，现在觉得也是人才啊，笑哭。今天简简单单用原生js写个时钟功能吧。

涉及知识

闭包

计时器setInterval(code,millisec[,”lang”])

代码

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>自制时钟</title>
</head>
<body>
<p id="demo">0</p>
<script>
var add = (function () {
var sec = 56,min=0,h=0;
return function () {
if(sec==59){
sec=-1;
min+=1;
}
sec+=1;
if(min==59){
min=-1;
h+=1;
}
if(h==23){
h=-1;
}
var obj={
"second":sec,
"minute":min,
"hour":h
};
return obj;}
})();
var plus =(function(){
let cnt="hello world!",name="simon";
return function(){ return cnt+=name;}
})();
function myFunction(){
var obj=add();
sec=obj.second;
min=obj.minute;
h=obj.hour;
if(sec<10){
p="0"+sec.toString();
}
else{
p=sec.toString();
}
if(min<10){
q="0"+min.toString();
}
else{
q=min.toString();
}
if(h<10){
r="0"+h.toString();
}
else{
r=h.toString();
}
document.getElementById("demo").innerHTML = "当前时间:<span style='color:red'>"+r+":</span><span style='color:green'>"+q+":</span><span style='color:blue'>"+p+"</span>";
}
setInterval(myFunction,1000)
</script>
</body>
</html>

实现效果

在GIS的沙场，轻舞飞扬。

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： javascript

相关文章推荐

新的分享

章节导航