Question

Is it possible to get the actual URL (as opposed to the src attribute value) of an image within the current DOM using jQuery or JavaScript?

i.e. retrieve “example.com/foo.jpg” as opposed to “foo.jpg” (taking <base> elements into account)

What about any other interesting properties such as the mime type, file size or, best of all, the actual binary data?

Answer 1

I wonder if jQuery is using .getAttribute() – using .src always seems to give the absolute 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>

To get the rest of the information, could you use an AJAX request and look at the header & data sent?