javascript - 每 500 毫秒闪烁不同颜色的文本 javascript

标签 javascript html web

我正在尝试创建一个简单的 JavaScript 脚本,该脚本会每 500 毫秒闪烁一次不同颜色的文本。我想到了类似的东西,但它不起作用,它只是以单一颜色打印出文本(绿色,黑色或红色三种之一)。感谢您的帮助

<html>
<body >
<script>

var f = function() { 
var str = "Hello World";;
var d = new Date();
var n = d.getTime();
switch(n%3)
  {
  case 1:
  fontcolor="green"
  break;
  case 2:
  fontcolor="black"
  break;
  default:
  fontcolor="red"
  }
document.write(str.fontcolor(fontcolor));   
 }
setInterval(f, 500);     
</script>
</body>
</html>

最佳答案

尝试这样的事情(请参阅评论以了解发生了什么):

// Wait until the document is ready

window.onload = function()
{
    // Create the element

    var txt = document.createElement('span');

    txt.innerHTML = 'Hello World!';

    // Insert the element to the document

    document.body.appendChild(txt);

    // Alternate the colors

    var colors  = [ 'red', 'green', 'blue', 'black', 'yellow', 'pink' ];
    var current = 0;

    setInterval(function()
    {
        // Update element's style with the new color

        txt.style.color = colors[current];

        // Go to the next color

        current = (current + 1) % colors.length;

    }, 500);
};

关于javascript - 每 500 毫秒闪烁不同颜色的文本 javascript,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15693513/

相关文章:

html - 如何像 gmail 那样在 css 中剪辑文本到电子邮件主题列表

css - 在css中为一个元素设置两个位置

html - 如何在按钮文本上添加渐变颜色?

html - 如何通过 CSS 定位盲文/屏幕阅读器

javascript - For循环不适用于js map 功能

javascript - 在将用户输入添加到 Javascript 中的 DOM 之前清理用户输入

javascript - Chrome/V8 对某些元素的 onmousemove() 变慢

强制刷新的 HTML 链接?

mysql - 如何优化简单 Web 和数据库应用程序的响应时间

javascript - 如果文本太长,如何用空格分隔文本?