Javascript 如何获取正在网页中显示的图像的属性

当用户右键单击网页中的图像并选择“属性”时，将显示详细的URL、大小、尺寸、创建（日期）、修改（日期）等信息

显然，我知道URL在我的代码中的位置，但其他一些URL不是，例如创建和修改日期，它们必须来自图像源的服务器。我试过使用

document.getElementById("photo").attributes

这里是相关的HTML代码

<img id="photo" src="http://www.somesite.com/photo.jpg" width="320" height="240" alt="offline" >

但这只返回在上面的img行中找到的5个属性

由于日期和其他信息可用于“属性对话框”，因此我假设文档对象中的某个位置也可以使用

关于如何使用JavaScript或VBScript访问它们，有什么想法吗

---

谢谢…RDK

好吧，你可以尝试获取图像的URL，然后对图像执行AJAX请求，获取响应头，它们会告诉你创建日期，等等。。你在追求

例如

var myImageURL = %YOUR_IMAGE_URL%
var modifiedHeader = 'Last-Modified';
var req = new XMLHttpRequest();
req.open('HEAD', myImageURL, false);
req.send();
var header = req.getResponseHeader(modifiedHeader);
if (header) {
    console.log(header); // this is the last modified date
}

编辑： 只有当图像可以通过AJAX访问时，这才有效。。。（同一原产地政策等）

编辑：

---

更改为head，因此SOP现在不重要。。谢谢@Musa

您使用JavaScript进行过调查吗？

创建和修改日期等信息将存储在图像的EXIF元数据中（如果有）

有一种方法提供了

exif（）

方法，例如

$（'img'）.exif（'DateTimeOriginal'）

请注意，JavaScript将无法访问托管在不同域上的图像

---

关于原始图像文件的宽度和高度的信息应该是图像对象本身的属性，例如

document.getElementById（'photo'）。自然高度

如果使用头部请求，SOP将不会踢inMusa和@Michael Coxon…感谢您的输入。我尝试使用类似于上面[link]的代码，它适用于某些图像源，但不适用于其他图像源。这就是为什么我要这样做。@RDK我提供的代码在IE中不起作用。你必须自己做这些重写。如果您尝试在任何其他浏览器，它应该工作。您可能需要使用

modifiedHeader

变量的大小写来获得所需的结果-我不确定JS是否从服务器转换大小写。如果没有，则可以使用

getAllResponseHeaders

函数，然后可以解析它返回的数组。Michael…不确定我做错了什么，我直接复制了您的代码，更新了url，但失败了。它执行请求open（“HEAD”，myImageURL，false）；但是没有通过req.send（）；Michael…..没有在5分钟内编辑上述内容。不确定我做错了什么，我直接复制了你的代码，更新了url，但失败了。它执行请求open（“HEAD”，myImageURL，false）；但是没有通过req.send（）；现在让我们更清楚地了解上面链接中的代码。它对某些URL非常有效，但似乎对其他URL无效，即等待readystate=4条件。我怀疑某些服务器正在阻止此访问…RDKMark…我查看了该对象，但没有看到/理解它将如何应用于此问题。你能提供更多的细节或代码吗？我再看看。谢谢…谢谢，我会查一下，试试看…RDK