Question

我希望我的div元素像计时器一样工作，并显示间隔为1秒的随机数。 http://jsfiddle.net/NHAvS/46/。那是我的代码：

var arrData = [];
for (i=0;i<1000;i++)
{
      arrData.push({"bandwidth":Math.floor(Math.random() * 100)});
}

var div = document.getElementById('wrapper').innerHTML =arrData;
document.getElementById('wrapper').style.left = '200px';
document.getElementById('wrapper').style.top = '100px';

但问题是它一次只显示1个数据。任何想法如何解决它？

由于

Answer 1

这样做：

setInterval(myfun,1000);

var div = document.getElementById('wrapper');
function myfun(){
   div.innerHTML ='bandwidth :'+Math.floor(Math.random() * 100);
}

看看：http://jsfiddle.net/techsin/NHAvS/49/

注意：你的例子搞砸了，因为在左侧它被设置为加载在head中，这意味着每次你的脚本在你的dom之前加载时你的div都会被定义。因此将其设置为onload使其工作更多。：d

注意：你似乎也像jquery一样链接函数，但在javascript中你不这样做。这些功能就是为了做到这一点。即div= ..getElementById..innerHtml='balbla';将设置div = bla ... not element。

Answer 2

你可以这样做：

var delay = 1000, // 1000 ms = 1 sec
    i;
setTimeout(function() {
  document.getElementById('wrapper').innerHTML = arrData[i];
  i++;
}, delay);

Answer 3

最好使用jQuery和CSS来实现所需的结果。 jQuery找到元素并显示随机数;和CSS而不是手动设置位置。（显然jQuery只是个人选择而且document.getElementById就足够了 - 但是如果你计划大量操作DOM，那么jQuery可能是一个更好的选择。见updated fiddle

$(function () {
    var arrData = [];
    for (i = 0; i < 1000; i++) {
        arrData.push({
            "bandwidth": Math.floor(Math.random() * 100)
        });
    }

    var index = 0;

    setInterval(function(){
        $("#wrapper").text(arrData[index].bandwidth);
        index++;
    }, 1000);    
});

用javascript显示div元素中的随机值

3 个答案: