更改计时器超时的字体颜色

Question

我找到了一个很好的例子来帮助我解释我想要做的事情！

“倒计时标签每秒都会改变，随着倒计时的进行，颜色会逐渐从绿色变为红色。”

这是如何工作的？如果有人能以最简单的方式解释我真的很感激它！

我知道它必须使用JavaScript并使用innerHTML

我找到了一个名为Display Morphing并使用AJAX的链接。问题是，我的导师从未告诉过我们必须使用AJAX。显示变形是我正在尝试做的适当术语吗？

http://ajaxpatterns.org/archive/Display_Morphing.php

我是否朝着正确的方向前进？我是否在“innerHTML =”之后添加了某种类型的函数来告诉页面我希望字体颜色如何/何时更改？

var hoursElement = document.getElementById("hours");
        hoursElement.innerHTML = 
var minutesElement = document.getElementById("minutes");
        minutesElement.innerHTML = 
var secondsElement = document.getElementById("seconds");
        secondsElement.innerHTML = 

Answer 1

您似乎正在更新时间显示。这里有一些额外的提示可以帮助您：

1. 不需要Ajax，只会使事情复杂化。查看setTimeout和Date，这应该足以满足您的需求。
2. 对于文本颜色，一旦你在var中有一个dom元素（比如说timeContainer），就可以用timeContainer.style.color = '#RRGGBB';更改内部文本的颜色。其中RR，GG，BB是十六进制数字文字中的红色，绿色和蓝色的数量。
3. 如果您还不知道，请查看http://jsfiddle.net，这将有助于您快速设置并测试您的HTML和JavaScript，看它是否正常工作。