js获取本地时间并展示在页面上:请看代码
<div class="curentTime" id="date">
<div class="hour">{{curTime.hour}}</div>
<div class="point">:</div>
<div class="minute">{{curTime.minute}}</div>
<div class="point">:</div>
<div class="second">{{curTime.second}}</div>
</div>
<style lang="scss>
.curentTime{
width:200px;
display: flex;
justify-content: space-around;
align-items: center;
position: absolute;
top: 550px;
left: 50%;
transform: translateX(-50%);
.point{
height:40px;
line-height: 40px;
color: #fff;
font-size:35px;
}
.hour,.minute,.second{
width:40px;
height: 40px;
color: #fff;
line-height: 40px;
font-size:28px;
font-weight: 500;
border-radius:8px;
text-align: center;
background:transparent;
border: 2px solid #fff;
}
.second{
margin-left: 0;
}
}
</style>
<script>
// 获取在线时间
getDateNow(){
let _this=this
this.timer=setInterval(function() {
let d = new Date()
let hour = d.getHours()
let minute = d.getMinutes()
let second = d.getSeconds()
_this.curTime.hour=_this.formateTime(hour)
_this.curTime.minute=_this.formateTime(minute)
_this.curTime.second=_this.formateTime(second)
// document.getElementById('date').innerHTML=_this.get10(hour) + ":" + _this.get10(minute) +':'+ _this.get10(second)
}, 100)
},
</script>