如何使用jQuery获取图片的URL？

Question

使用jQuery或JavaScript，是否有可能获取当前DOM内图像的实际URL（而不是src属性值）？

也就是说，考虑到<base>元素，能否检索出"example.com/foo.jpg"而不是"foo.jpg"？

其他一些有趣的属性如MIME类型、文件大小，甚至是二进制数据是否可以获取？

- stovroz

---

考虑到 <base> 元素，将 http://example.com/foo.jpg 转换为 "foo.jpg"。 - Quentin

Answer 1

我想知道 jQuery 是否使用 .getAttribute() - 使用 .src 始终会给出绝对 URL：

<img src="foo.jpg" id="i">

<script>
var img = document.getElementById('i');

alert(img.getAttribute('src')); // foo.jpg
alert(img.src);                 // http://..../foo.jpg
</script>

要获取剩余的信息，您可以使用 AJAX 请求并查看头文件和发送的数据吗？

- Greg

---

要使用 jQuery 选择器完成这个操作，可以使用以下代码：$(selector).get(0).src; 这行代码的作用是获取匹配到的第一个元素的 src 属性。 - Pim Jager

格雷格，思路不错，干杯。至于其余部分，我希望我能在不需要额外的 AJAX 往返的情况下做些事情，因为它应该已经加载了，并且避免任何跨站点 AJAX 问题也是好的。 - stovroz

现在我可以使用 amp-iframe 抓取首页中 src 的值。 - Joe Kdw

Answer 2

$(你的 IMG 选择器).attr('src');

举个例子，如果我们有一个 <img src='bla-bla.jpg' id='my_img'>

那么我们会这样做：

$('#my_img').attr('src');

- user149662

Answer 3

var img = $('img');
alert(img.attr('src')); // foo.jpg
var fullpath = window.location.host + img.attr('src');
alert(fullpath); // http://example.com/foo.jpg

- Jigarb1992

---

这有什么用处呢？你在做什么呢？请解释一下，这样初学者才能学到东西。你的回答对于初学者来说并不是很清晰。 - Randy

Answer 4

简单

$("#my_img").src;

只是它解决了问题

- Guilherme Schvarcz Franco