2021-05-05

<div class="container">
        <span id="time">2021年03月28日 08时00分00秒</span>
	</div>
	<div class="btngroup">
		<button id="start">开始</button>
		<button id="stop">暂停</button>
	</div>

 

*{
	margin: 0;
	padding: 0;
}
body{
	background: #ef4036;
    color: #fff;
}
.container{
	margin: 100px auto;
	text-align: center;
	font-size: 4rem;
    font-weight: 300;
}
.container span{
	display: inline-block;
}
.btngroup{
	text-align: center;
}
.btngroup button{
	margin: 0px 10px;
	padding: 30px 100px;
	border:none;
    border-radius: 5px;
	font-size: 2rem;
	color:#fff;
    cursor: pointer;
}
.btngroup button:first-child{
	background: #000;
}
.btngroup button:last-child{
	background: #ffb200;
}

// JavaScript Document
var timer=null;
var btn=document.getElementById("start");
var btn2=document.getElementById("stop");
btn.onclick=function(){
    /*var timee= document.getElementById("time");*/
    timer = setInterval(function(){
        conn();
    },1000)
}
btn2.onclick=function(){
    timer = clearInterval(timer)
}
function conn(){
   /* var osp1=document.getElementById("sp1");
    var osp2=document.getElementById("sp2");
    var osp3=document.getElementById("sp3");*/
    var shm=new Date();
    var year=shm.getFullYear();
    var mouth=shm.getMonth()+1;
    var day=shm.getDate();
    var shh=shm.getHours();
    var she=shm.getMinutes();
    var miao=shm.getSeconds();
    mouth=mouth<9?"0"+mouth:mouth;
    day=day<9?"0"+day:day;
    shh=shh<10?"0"+shh:shh;
    she=she<10?"0"+she:she;
    miao=miao<10?"0"+miao:miao;
    /*sp1.innerHTML=shh;
    sp2.innerHTML=she;
    sp3.innerHTML=miao;*/
    var str=year+"年"+mouth+"月"+day+"日"+shh+"时"+she+"分"+miao+"秒";
    document.getElementById("time").innerHTML=str;
}

北京时间