前言：
如今看官们对“js中的计时器”可能比较着重，看官们都需要知道一些“js中的计时器”的相关资讯。那么小编在网上搜集了一些关于“js中的计时器””的相关文章，希望看官们能喜欢，姐妹们快快来了解一下吧！源代码如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>计时器</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style type="text/css">
*{
margin:0;
bottom:0;
}
h1{
height:20px;
}
#timePic{
margin-top:50px;
}
</style>
<script type="text/javascript">
setInterval(jishi,1000);
function jishi(){
var time=new Date();
var year=time.getFullYear();
var month=time.getMonth();
var iday=time.getDate();
var day=time.getDay();
var hour=time.getHours();
var minute=time.getMinutes();
var seconds=time.getSeconds();
var pic=document.getElementsByClassName("timePic");
switch (day){
case 0:day="星期日";break;
case 1:day="星期一";break;
case 2:day="星期二";break;
case 3:day="星期三";break;
case 4:day="星期四";break;
case 5:day="星期五";break;
case 6:day="星期六";break;
}
var str=year+"年"+(month+1)+"月"+iday+'日'+day+' '+changTime(hour)+':'+changTime(minute)+':'+changTime(seconds);
var str1=changTime(hour)+''+changTime(minute)+''+changTime(seconds);
console.log(str1.length);
for(var i=0;i<6;i++){
pic[i].src="Image/"+str1.charAt(i)+".JPG";
}
var ti=document.getElementsByTagName("h1");
ti[0].innerHTML=str;
}
function changTime(obj){
return obj<10 ? ('0'+obj):obj;
}
</script>
</head>
<body>
<h1></h1>
<p id="timePic">
<img class="timePic" src="Image/0.JPG" alt=""/>
<img class="timePic" src="Image/0.JPG" alt=""/>
<img src="Image/colon.JPG" alt=""/>
<img class="timePic" src="Image/0.JPG" alt=""/>
<img class="timePic" src="Image/0.JPG" alt=""/>
<img src="Image/colon.JPG" alt=""/>
<img class="timePic" src="Image/0.JPG" alt=""/>
<img class="timePic" src="Image/0.JPG" alt=""/>
</p>
</body>
</body>
</html>
效果如下：
这是一个计时器效果，使用Js里面的Date()对象实现。想要图片素材点击关注私信我！
标签： #js中的计时器
