前两天一个朋友想做的东西,放在他们公司内部网页上,用来观察高速路的路况快照。

路况快照本身是由政府网站提供,每两分钟更新一次,并且地址固定。所以我就提出了用 JavaScript 的 setInterval 来实现它。

为了简化 DOM 操作,我直接使用了 jQuery ;-)

我的解决方案是利用 jQuery 的万用 load() 将临时元素按间隔时间替换成最新的图片元素。为了确保浏览器忽略缓存、强制刷新图片,我在图片地址后用 Math.random() 做了一个假的 query。最后我用 jQuery 核心自带的两个效果稍微增强了一点感官体验。演示地址和源代码在此:http://perfectcoda.com/lab/refresh/

另外一个朋友的解决方案思路更简单,用 jQuery 直接改变固定图片元素的 src 属性以达到更新图片的目的。演示地址和源代码在此:http://perfectcoda.com/lab/refresh/index2.html