无限循环显示随机数js

Question

我的代码没有按我想的那样工作。它必须显示一个随机数，但每隔几毫秒就会改变一次，并且不会停止。

这是 DOM：

<p>Random number:</p>
<p id="random_number"></p>

还有我的脚本：

var random_script = function() {
    while (true) {
        setTimeout(function(){
           var t = Math.round(Math.random() * (100 - 1) + 1);
           document.getElementById("random_number").innerHTML = t;
        }, 1000);
    }
}();

但是 chrome 一直在崩溃。请问有什么帮助吗？

Answer 1

我建议：

(function(el, interval) {
    window.setInterval(function(){
        // you can use the math you were using, but I can't see the necessity
        el.textContent = Math.floor(Math.random() * 100);
    }, interval);
})(document.getElementById('random_number'), 1000);

JS Fiddle demo.

这种方法是一个立即调用的函数表达式，它将相关参数传递给函数，然后将函数设置为在定义的时间间隔内执行。这使用window.setInterval 以重复的间隔重复/重新调用传递的函数，而不是在一个间隔之后 只执行一次（就像setTimeout 那样）。

参考资料：

• Immediately-Invoked Function Expressions ('IIFE')。
• window.setInterval()。

Answer 2

http://jsfiddle.net/5FE8p/ 会有所帮助。

function myFunc ()
{
    setTimeout(function() {
        var t = Math.round(Math.random() * (100 - 1) + 1);
        console.info(t);
        document.getElementById("random_number").innerHTML = t;
        myFunc();
    }, 1000);
}
myFunc();

您不应一次调用 settimeout 多次。它们是异步触发的......

Answer 3

    setInterval(function(){
       var t = Math.round(Math.random() * (100 - 1) + 1);
       document.getElementById("random_number").innerHTML = t;
    }, 1000);