Setting img tag's src as the result of a javascript function

Question

I have a function getImgurUrl() and I want what it returns to be the src value of a img tag.

How can I do this?

my function:

function getImgurUrl() {
    //get imgur url for current image
    var cookieArray = document.cookie.split(";");
    var encodedURL = cookieArray[2].split("=");
    var decodedURL = decodeURIComponent(encodedURL[1]);
    return decodedURL;
}

and img tag:

<img id="image" name="image" src=""  alt="If you're seeing this something is wrong.">

Esailija · Accepted Answer · 2012-07-15 14:04:06Z

8

window.onload = function() {
    document.getElementById("image").src = getImgurUrl();
};

edited Jul 15, 2012 at 14:04

answered Jul 15, 2012 at 13:51

Esailija

140k24 gold badges280 silver badges328 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Esailija Over a year ago

@AClockworkOrange You should look for possible errors with your code in your console and also inspect the active DOM to see if the src was changed to the expected value.

A Clockwork Orange Over a year ago

In chrome's Javascript console I'm seeing this "Uncaught TypeError: Cannot set property 'src' of null"

Devin Burke Over a year ago

@AClockworkOrange Make sure you only have one element with an id of image!

Mike S. · Accepted Answer · 2012-07-15 13:58:46Z

0

function getImageUrl(imageId) {
  return document[imageId].src;
}

<img id="mike" src="http://yoursite.com/images/1.jpg" />

I haven't tested this but you get the idea.

I'm not sure what you're doing with the cookie logic so just kept example simple.

--

I would recommend you add jQuery to handle cross-browser compatibility as getElementById or others may not work all the time and all versions, also document. might not as well and sometimes it's window.functionName()

In jQuery you would reference the image src similarly but in my return, you'd concat a pound symbol with the id:

return $('#' + id).src;

edited Jul 15, 2012 at 13:58

answered Jul 15, 2012 at 13:53

Mike S.

4,8791 gold badge35 silver badges35 bronze badges

1 Comment

Mike S. Over a year ago

also, you might have luck in testing using alert(contentHere) to make sure you can get the desired value... for example in your code throw in an alert(document['mike'].src); and if fails try alert(document.getElementById('mike').src); etc. I would recommend you look at jQuery though.

Collectives™ on Stack Overflow

Setting img tag's src as the result of a javascript function

2 Answers 2

3 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related