不同日期的动态倒计时时钟-纯Javascript

如果我错误地提出了这个问题，或者之前有人问过并回答过，我会提前道歉。我的搜索找到了类似的问答，这些问答都是基于JQuery和/或静态日期的，我正在寻找一个带有动态日期的纯JavaScript解决方案

jsfiddle

小提琴显示从当前日期开始的日期倒计时，输出显示达到日期前剩余的天数和小时数，一旦超过“golivedate”，它也将显示该日期

这部分是我正在寻找的，但是，由于将有多个事件（100+）与不同的倒计时日期，它需要是动态的，而在它的当前状态，它不是。我相信更改为.GetElementsByCassName可能是一种解决方案，使我能够多次出现类名，而不是限制为.getElementById的一个实例，但我不确定如何进行切换。我也不确定如何才能添加多个“golivedates”

其次重要的是，在满足设置关键日期标记时，在日期旁边有一些文本输出，例如，剩余1天23小时的“明天上线！”和剩余23小时的“今天上线”。一旦超过日期，将显示“立即直播！”消息，而不是任何倒计时。 这可能是由var before=“Text”var current=“Text”实现的，但我的专业知识（非常！）有限，所以我不确定这是否正确，或者如何实现

总之，我请求帮助：

• 将.getElementById切换为.getElementsByClassName
• “golivedate”是动态的，而不是单个事件
• 显示剩余X时间的相关文本，然后在满足日期时用文本替换倒计时时钟

---

我在这里写了很多东西，所以如果你花时间阅读，谢谢你。如果我不清楚，请告诉我，我会尽可能进一步解释

编辑：

可以使用以下格式的跨距：

<span class="golivedate" data-countdown="Aug 25, 2015"></span>

对于每个元素，您将获得其数据属性的值（即日期）：

检查日期是否在过去，如果是，则为其指定不同的文本并删除该类：

if(seconds_left <= 0) {
    glds[i].innerHTML = "Hurray!"
    glds[i].className = ""
}

---

if（还剩几秒钟）谢谢-但是我有点困惑如何添加“golivedate”的单个实例span在不同的地方，而不是一次全部显示。您对显示我的OP中概述的相关文本也有任何想法吗？谢谢，但这与原始标准大不相同。我正在寻找各种“golivedate”日期能够单独显示所述日期，而不是按照您的原始答复显示为一组。通过此编辑，它似乎已恢复为仅显示一个静态日期。好吧，也许我误读了您的第一条评论，我以为您希望在不同的位置显示相同的倒计时。因此，您希望不同的倒计时，但只是为了让他们在不同的地方？再次编辑了答案。谢谢武士，就这样！如果我之前把你弄糊涂了，很抱歉，我真的很感谢你花时间看我的问题并坚持下去。你对如何实现我问题的第二部分，关于课文，有什么想法吗。我知道你提到过一个日期过后就取消课程我正在寻找一些更具活力的东西，它符合我OP中的其他标准。
var dt = glds[i].getAttribute('data-countdown');

if(seconds_left <= 0) {
    glds[i].innerHTML = "Hurray!"
    glds[i].className = ""
}

var days, hours, minutes, seconds;

setInterval(function () {
    var glds = document.querySelectorAll('span.golivedate');
    var current_date = new Date().getTime();

    for (var i = 0; i < glds.length; i++) {
        var dt = glds[i].getAttribute('data-countdown');
        var seconds_left = (new Date(dt).getTime() - current_date) / 1000;
        if(seconds_left <= 0) {
            glds[i].innerHTML = "Hurray!"
            glds[i].className = ""
        }
        else {
            days = parseInt(seconds_left / 86400);
            seconds_left = seconds_left % 86400;
            hours = parseInt(seconds_left / 3600);
            seconds_left = seconds_left % 3600;
            minutes = parseInt(seconds_left / 60);
            seconds = parseInt(seconds_left % 60);

            glds[i].innerHTML = days + "d, " + hours + "h" + ", " + seconds;
        }
    }

}, 1000);