Question

我有一个简单的HTML页面

<ul>
  <li ng-repeat="item in getItems(a,b)">{{item}}</li>
  
  <li>
    <span ng-click="$scope.showContent = true"></span>
  </li>
  
  <li ng-if="$scope.showContent">
    content to be shown on 'button' press
  </li>
</ul>

此图片每天都会更新

如何让我的页面每天或每12小时更新一次此图片

我希望JavaScript更新它的原因因为我在HTML小部件中使用它哪个不会自我更新

Answer 1

正如this page所述，只需使用缓存断路器重新加载您的图片：

const img = document.getElementById("myImage")

setInterval( () => {
   img.src = "http://www.hamqsl.com/solar101pic.php?" + new Date().getTime();
}, 1000*3600*12) // 12 hours in ms

<img id="myImage" src="http://www.hamqsl.com/solar101pic.php" />

通过在URL之后添加?randomstuff，您可以强制浏览器获取该文件的新副本，因为它未被识别为位于缓存中。

Answer 2

您打算手动更新图片的链接吗？或者URL中的“101”是否会增加？

如果链接是静态的，除了某种数字整数，那么我会使用JavaScript将HTML注入您的网页。检查：

var imgHtml = '<img src="http://www.hamqsl.com/solar101pic.php">';
document.getElementById('tag-id').innerHTML = imgHtml

您可以使用Date.now（）函数获取纪元时间，然后使用MOD（％）来设置适当的间隔。这就是你如何获得12小时。我会留给你找出来的。

Answer 3

setInterval(function() { location.reload(); }, 5000);

<强>更新

我认为你的逻辑不会成功，因为当你打开它时浏览器开始计数，所以图像会在打开后12小时内改变，而不是在特定时间，所以你必须选择

在服务器端设置图像URL
在时钟上为每小时分配图像

Answer 4

window.location.reload(true)强制页面重新加载而不使用缓存版本。（MDN）

您可以这样实现计时器：

setTimeout(function(){  
  window.location.reload(true);
},4.32e+7); // 12 hours refresh rate. This is the time, in milliseconds.

有关setTimeout (MDN)的更多信息。

Answer 5

您可以使用Javascript的setTimeout函数，该函数会在达到指定的计时器（以毫秒为单位）时触发事件：

setTimeout(function(){
    window.location.reload(1);
}, 3600);

或者您可以使用以下元标记（以秒为单位）：

<meta http-equiv="refresh" content="3600" />

编辑：想到更好的方法。如何使用jQuery删除元素然后再重新绘制元素？

如何在每个特定时间刷新图像？ JavaScript的

5 个答案: