给出以下示例
<img id="my_img" src="images/current.png" />
<script language="javascript">
var i = document.getElementById('my_img');
var filetime = i.is_there_any_method_for_this(); // ?????
i.title = 'image created: ' + filetime; // don't care about formating now
</script>
我想问一下is_there_any_method_for_this();存在或者是否可以访问所显示图像的文件创建(或修改)时间.
解决方法
结果表明,Apache似乎默认将最后修改时间作为标题发送.只能通过使用您描述的javascript方法来获取此标头是不可能的.你可以通过使用AJAX重新下载文件,并且检查重新下载的图像的最后修改时间(几乎总是与原始图像相同),以非100％可靠或有效的方式完成.
使用一个小jQuery进行AJAX调用…
<img id="my_img" src="images/current.png" />
<!-- include jQuery - better done in the head -->
<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script language="javascript">
var i = document.getElementById('my_img');
$.get(i.src,function(data,status,xhr){
// in the callback - after the ajax request completes...
var filetime = xhr.getResponseHeader('Last-Modified');
i.title = 'image created: ' + filetime; // don't care about formating now
})
</script>
此方法仅在服务器发送正确的Last-Modified标头时才起作用,并且它可能与先前加载的图像不同(尽管通常不是),并通过重新下载您想要时间戳的图像来引起额外的流量和请求.
如果可能的话 – 我认为一个更好的解决方案是让服务器通过一个小数据源公开文件的时间戳,也可以根据文件名作为关键字发送JSON显示每个文件的最后修改和其他元数据…所以服务器应该发送这样的东西：
{
"images/current.png":{"last-modified":"2012-08-07","filesize":"1056 kb"},"images/raisin.png":{"last-modified":"2012-08-04","filesize":"334 kb"},"images/sultana.png":{"last-modified":"2012-08-02","filesize":"934 kb"}
}
然后,很容易解析客户端(使用JSON.parse())并确定所需的所有文件大小 – 更高效,更可靠.
