Today, we created a DOBRIC (Dynamic On Browser Refresh Image Changer) in class. Using four found images, this script randomly adds one of the four images to the HTML document every time the user refreshes the page.
- Acquire 4 unique images.
- Put the images in the same root folder as your HTML file.
- Create an array with 4 strings, each string being an image name (e.g., “dog.jpg”)
- Use Math.random() to generate a random number from 0-3.
- Access the array using the random number (e.g., imgs[randNum]) and store it in a variable.
- Use document.write() to create an img tag using the randomly chosen image name as the src attribute.