javascript - 如何使用javascript每5秒重新加载一次img?

标签 javascript

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

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

最佳答案

每次要重新加载图像时,都必须像这样更改图像 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 秒。

关于javascript - 如何使用javascript每5秒重新加载一次img?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4572193/

相关文章:

javascript - 如何使用 Angular 和 webapi 或 mvc 处理测验应用程序中的安全性?

javascript - 如何在 JavaScript 中停止函数多次执行?

javascript - 无法通过 JavaScript 函数解析字符串

javascript - 使用 Knockout .sort() 对 JSON 数据进行排序

javascript - 从 JSON、Node.js 获取值

JavaScript:在模糊时清除 setInterval,并在焦点上恢复

javascript - 警告用户他们将丢失数据的最佳实践

javascript - 在 jQuery AJAX 加载后重新触发某些脚本

javascript - Angular 从 API 调用返回数据作为 [Object Object],但在组件中未定义

javascript - jQuery 跳转到元素