console
function timingInterVal(minute, second, millisecond) {
var timing = setInterval(function () {
if ((Number(millisecond.innerHTML)) <= 0) {
if ((Number(second.innerHTML)) <= 0) {
if ((Number(minute.innerHTML)) <= 0) {
clearInterval(timing);
return false;
} else {
(Number(minute.innerHTML)) <= 10 ? minute.innerHTML = ('0' + ((Number(minute.innerHTML)) - 1)) : minute.innerHTML = ((Number(minute.innerHTML)) - 1);
}
second.innerHTML = '60';
} else {
(Number(second.innerHTML)) <= 10 ? second.innerHTML = ('0' + ((Number(second.innerHTML)) - 1)) : second.innerHTML = ((Number(second.innerHTML)) - 1);
}
millisecond.innerHTML = '99';
} else {
(Number(millisecond.innerHTML)) <= 10 ? millisecond.innerHTML = ('0' + (Number(millisecond.innerHTML) - 1)) : millisecond.innerHTML = (Number(millisecond.innerHTML) - 1);
}
}, 16);
}
const btn = document.getElementById('btn')
console.log(btn)
btn.onclick = function () {
var timing = document.getElementsByClassName('timing');
for (var i = 0; i < timing.length; i++) {
var minute = timing[i].querySelector('.minute');
var second = timing[i].querySelector('.second');
var millisecond = timing[i].querySelector('.millisecond');
timingInterVal(minute, second, millisecond);
}
}
<div class="timing">
<span class="minute date">00</span>
<span class="colon">:</span>
<span class="second date">15</span>
<span class="colon">:</span>
<span class="millisecond date">00</span>
</div>
<button id="btn">开始</button>
.timing {
color: #ed4123;
font-size: 20px;
font-weight: 600;
font-family: sans-serif;
display: flex;
}
.timing > span {
display: block;
float: left;
}
.date {
width: 35px;
text-align: center;
}