CODEWITHSUNDEEP
javascripthtml
Nic
Nic

Reputation: 43

How to get an image to change when a button is clicked?

I have a div tag which holds an image that is picked at random from a if statement. My image src are in a number of different arrays sorted via topic. What I am having difficulties with is the image changing when my go button is clicked I would like the if statement to repeat giving a new image from a different topic , am I missing something simple here ? I fairly new to javascript so any help would be appreciated.

Upvotes: 2

Views: 111

Answers (1)

plalx
plalx

Reputation: 43718

The main issue seems to be the way you are trying to replace the existing image.

document.write = image;

The previous line replaces the native document.write function with your image markup, wich is obviously not what you want.

Without re-writing all your code, what you could do is find the div that holds the image and replace it's innerHTML property with the content of your image variable.

document.getElementById('div_that_hold_the_image').innerHTML = image;

Please note that if that div contains other children, they will all be removed

I strongly advise you to read more on JavaScript. Even tough your code will run, it has plenty of issues that should be adressed.

For instance, you should not rely on global variables to pass data around and you don't need to evaluate a string literal using () before assigning it to a variable.

topic=("Tv Shows"); can just be topic = "Tv Shows";

Upvotes: 1

Related Questions