如何使用javascript每5秒重新加载一次图像?

时间:2010-12-31 20:32:17

标签: javascript

如何使用javascript每5秒重新加载图片?

<img src="screen.jpg" alt="" />

1 个答案:

答案 0 :(得分:34)

每次要重新加载图像时,必须更改图像URL,如下所示:“screen.jpg?rand = 123456789”其中“123456789”是随机生成的数字,每次要重新加载时都会重新生成图片。浏览器会认为它是一个不同的图像,并实际下载它,而不是从缓存中检索它。 Web服务器很可能会忽略并丢弃问号后的所有内容。

要首先进行重新加载,您必须使用Javascript来获取图像元素并更改源。我能看到的最简单的选项是给图像元素一个id属性,如下所示:

<img src="screen.jpg" id="myImage" />

然后你可以改变图像的来源:

var myImageElement = document.getElementById('myImage');
myImageElement.src = 'screen.jpg?rand=' + Math.random();

要在设定的计时器上执行此操作,请使用顶级Javascript函数setInterval

setInterval(function() {
    var myImageElement = document.getElementById('myImage');
    myImageElement.src = 'screen.jpg?rand=' + Math.random();
}, 5000);

第二个参数指定5000毫秒,相当于5秒。