我有一个工作的倒数计时器,“天,小时,分钟,秒”,我需要将秒“ var”的颜色从白色更改为黄色,而其他var则保持白色。
问题是整个倒计时日期都放在一个div上,我无法在“ seconds”变量中添加特定的类或跨度。
我尝试了许多不同的解决方案,但在这种情况下似乎都无法解决,因此我决定寻求帮助并提出问题。
HTML。
<div class="container">
<div id="countdown" align="center"> <!-- The countdown is being displayed here -->
</div>
</div>
JS。
CountDownTimer('06/01/2016 06:00 AM', 'countdown');
function CountDownTimer(dt, id)
{
var end = new Date(dt);
var _second = 1000;
var _minute = + _second * 60;
var _hour = _minute * 60;
var _day = _hour * 24;
var timer;
function showRemaining() {
var now = new Date();
var distance = end - now;
if (distance < 0) {
clearInterval(timer);
document.getElementById(id).innerHTML = 'end';
return;
}
var days = Math.floor(distance / _day);
var hours = Math.floor((distance % _day) / _hour);
var minutes = Math.floor((distance % _hour) / _minute);
var seconds = Math.floor((distance % _minute) / _second);
document.getElementById('countdown').innerHTML = days + ' ';
document.getElementById('countdown').innerHTML += hours + ' ';
document.getElementById('countdown').innerHTML += minutes + ' ';
document.getElementById('countdown').innerHTML += seconds + ' ';
}
timer = setInterval(showRemaining, 1000);
}
在这里工作JS FIDDLE,您可以自己看到:
https://jsfiddle.net/baqc6nx2/1/
这是解释秒变var应该被染成黄色而其他变白的图像。
对不起,我的英语不好,谢谢您的宝贵时间。
编辑: - - - - - - - - - - - - - - - - - - - - - - - - ---------------
这不是重复项,我知道最后一个子选择器,但是在这种情况下,它无法正常工作,我尝试过。
编辑 - - - - - - - - - - - - - - - - - - - - - - - - - ----------------
TGO帮助了我,现在它可以正常工作,请重新打开问题,以便我完成。
最佳答案
这是一个更新的小提琴,可以解决您的问题。 http://jsfiddle.net/baqc6nx2/2
为了方便起见,这是更改后的代码行:
document.getElementById('countdown').innerHTML += '<span style="color:yellow;">' + seconds + '</span> ';
在这里,我创建了一个span标记,为其提供了适当的CSS样式以将颜色变为黄色,并将seconds值放入span元素内。