Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

HTML Introduction to HTML and CSS HTML: The Structural Foundation of Web Pages and Applications Image Tags

Oscar Gomez
Oscar Gomez
6,353 Points

when using "https://placeimg.com/400/400/people", the image doesn't change upon refresh. It stays the same. Any ideas?

this happened during the first lesson using index.html

2 Answers

Steven Parker
Steven Parker
211,060 Points

Assigning a random or time tag in the PHP doesn't help, because it's only done once when the page is created at the server, and the browser still caches the page and doesn't reload it on refresh.

The JavaScript trick works because because it happens in the browser, and the browser re-runs it on refresh.

Nadia Reyhani
Nadia Reyhani
488 Points

so you mean we need Javascript tricks to control the UI ? I still have a long way to Js concepts. will try it when I got to learning those subjects. Many thanks

Steven Parker
Steven Parker
211,060 Points

Your browser may be displaying a cached image instead of fetching a new one.

You can add a fake query string to your image URL to prevent the browser from using the cached version with a line of JavaScript:

document.querySelector("img").src += "?nocache=" + Math.random();

This particular script will only work for the first image on the page.

Nadia Reyhani
Nadia Reyhani
488 Points

I have the same issue, I tried your solution however it didn't work for me! I even tried to give a random stamp to avoid browser saves the images : <img src="https://placeimg.com/200/200/tech"?t=<?php echo time();?"> alt =""> no luck to fix this issue!