将css类或span添加到.js变量

时间:2016-05-17 11:44:21

标签: javascript jquery css

我有一个工作倒数计时器"天,小时,分钟,秒"我需要改变秒的颜色" var"从白色到黄色,而其他var将保持白色。

问题是整个倒计时日期都放在一个div上,我无法在"秒"中添加特定的类或跨度。变量

我尝试了很多不同的解决方案,但在这种情况下似乎都没有,所以我决定寻求帮助并提出问题。

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/

以下是解释秒变量应如何着色为黄色而其他变量为白色的图像。

How it should look. The second var displayed with yellow color.

抱歉我的英语不好,谢谢你的时间。

编辑:--------------------------------------------- ------------------

这不是重复,我知道最后一个孩子选择器,但在这种情况下它不会工作,我试过。

编辑---------------------------------------------- -------------------

TGO帮助我,现在它正在运行,请重新打开这个问题,以便我可以完成它。

1 个答案:

答案 0 :(得分:2)

这是一个更新的小提琴,可以解决您的问题。 http://jsfiddle.net/baqc6nx2/2

为方便起见,这是更改的代码行:

document.getElementById('countdown').innerHTML += '<span style="color:yellow;">' + seconds + '</span> ';

在这里,我创建一个span标签,给它适当的CSS样式以将颜色变为黄色,并将秒值放在span元素中。