7

I've got image tags that look like this:

<img src="/path/to/my/image.jpg" />

But when I access the src bit using jQuery, jQuery gives me back:

http://example.com/path/to/my/image.jpg

This is causing problems in some comparisons I'm doing. I don't want to change my image paths to use absolute URLs.

Any ideas as to how I can either get the absolute URL from the image path (this might not be as simple as concatenating the domain - since the URLs may occasionally be absolute), or get the path I provided in the HTML? Either way I need them to match up.

Edit per comment from activa

There's not really a lot of jQuery code to post, I'm using the cycle plugin, and in the onbefore function, I'm just calling next.src. My jQuery and JavaScript foo isn't sufficient to really understand what the cycle plugin is doing to generate next - I think it's the DOM element for the next image being cycled in, if you're familiar with what cycle does.

My image tag is actually this:

<img src="/site_media/photologue/photos/cache/6927d406810ee9750a754606dcb61d28.jpg" alt="" class="landscape slideshow-image-1" />

and in my onbefore function this code:

alert(next.src);

results in an alert with:

http://127.0.0.1:8000/site_media/photologue/photos/cache/6927d406810ee9750a754606dcb61d28.jpg
2
  • Can you post the jQuery code you are using to retrieve the src attribute? Because this doesn't seem right. As Mario pointed out below, the src attribute will not be modified by jQuery Jun 4, 2009 at 7:23
  • In my case I actually wanted the absolute URL, so I just did what were doing before you fixed it. Awesome :) Aug 28, 2011 at 5:41

4 Answers 4

18

$("img").attr("src") gives back the actual value of the src attribute (tried in FF3 and IE7)

So when you have

<img src="http://example.com/path/to/my/image.jpg" />

it will return

http://example.com/path/to/my/image.jpg

And when you have

<img src="/path/to/my/image.jpg" />

it will return

/path/to/my/image.jpg

Edit after edit of question

Sounds like you may want to try

$(next).attr("src")
0
1

why don't you strip it?

var hostname = 'http://' + window.location.hostname;

it will assing to hostname

http://example.com

then refactor your variable like

if( imgSrc == imgSrc2 ) ...

to

if( ImgSource(imgSrc) == imgSrc2 ) ...

using

function ImgSource(path) {
    return hostname + path;
}

or the other way arround

function ImgSource(path) {
    return path.replace(hostname, '');
}
1
  • If you are testing on local machine you should use window.location.host to get the port number attached to the hostname. Feb 26, 2017 at 19:03
1

To always get the full resolved path, use Element.src , not Element.getAttribute("src") (which seems to be the equivalent of attr("src")).

E.g.:

document.getElementsByTagName("img")[0].src

rather than:

document.getElementsByTagName("img")[0].getAttribute("src")

. I'll let you jqueryify .src.

0
0

I have this happening on a page loaded via Ajax on a server that seems to be .NET based. Even though the path is relative its returning the full URL even though in all other browsers it works fine. Only happening in IE 8. I can't strip off based on a domain since there are several environments for the project I'm working on.

I'll report back if I find anything better than just splitting or regex replacement.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.