0

问题已得到解答。

注意：我试图将其输出到我仅使用控制台作为参考的网页。我已经设置了css代码。

    var r_text = ['Hi', 'Go', 'No'];
function countdown() {

    var count = 20;
    var timerId = setInterval(function() {
        count--;
        console.log(count);

        if(count == 0) {
            console.log(r_text[Math.floor( Math.random() * r_text.length )]);
            count = 20;
        }
    }, 1000);
}
countdown();
4

1 回答 1

1 
var r_text = ['Hi', 'Go', 'No'],
    textProp = 'textContent' in document.createElement('div') ?
               'textContent' :
               'innerText',
    //update this ID selector to match an element in the page:
    elementToReceiveWord = document.getElementById('WORD'),
    seconds = 20; //timer in seconds

function countdown() {
    var count = seconds;
    var timerId = setInterval(function() {
        count--;
        console.log(count);

        if(count == 0) {
            var word = r_text[Math.floor( Math.random() * r_text.length )];
            elementToReceiveWord[textProp] = word;
            setTimeout(function() {
                  elementToReceiveWord[textProp] = '';
            }, 5000);
            count = seconds;
        }
    }, 1000);
}
countdown();

演示

不要忘记更新elementToReceiveWord的 ID 选择器以选择页面中的元素。

您的原始代码有几个错误：

  • r_randomtext/ r_textvar 名称不匹配；
  • 在显示文本之前不绘制新的随机值；
  • Math.random() * x 中的数组长度错误；
  • 计时器是 10 秒而不是请求的 20 秒。

改进：

  • 使用文字数组语法（更简洁、更短且解释器优化友好）。
  • 内联了一些数学运算。

我也对元素的文本属性进行了特征检测检查。所有现代浏览器textContent都支持 W3C 标准，我将innerText其用作旧 IE 的后备。Chrome 支持这两个属性，Firefox 只支持textContent，而 IE<9 不支持textContent（因此是innerText后备）。

如果您不关心旧的 IE，您可以删除该检查并简单地使用element.textContent = ...。

于 2013-11-14T22:26:08.640 回答