HTML 페이지에서 이미지를 항상 새로 불러오려면 이미지 URL에 고유한 파라미터를 추가할 수 있습니다. 이 방법은 브라우저 캐싱을 우회하므로, 매번 페이지를 로드할 때마다 이미지가 새로 불러와집니다.

htmlCopy code
<img src="image.jpg?time=" alt="My Image">

여기서 는 현재 시간의 타임스탬프나 고유한 값을 채우는 것입니다.

Javascript를 사용하면 이미지 태그에 동적으로 이 파라미터를 추가할 수 있습니다. 예를 들면, 아래와 같이 작성할 수 있습니다:

htmlCopy code
<script>

   window.onload = function()
    {
    var imgs = document.getElementsByTagName('img');
    
      var timestamp = new Date().getTime();
    

      for (var i = 0, l = imgs.length; i < l; i++) {

         imgs[i].src = imgs[i].src + "?time=" + timestamp;

      }

    } 
</script>

위의 스크립트는 페이지 로드 시 모든 이미지의 src에 고유한 타임스탬프를 추가합니다. 이렇게 하면 브라우저는 이미지를 새로 불러와야하므로, 캐시된 이미지를 사용하지 않습니다.

이 방법은 이미지를 항상 새로 불러오도록 강제하지만, 페이지 로드 시간이 늘어날 수 있음을 유의해야 합니다. 이미지가 크거나 많은 경우, 이 방법을 사용하면 사용자의 경험이 떨어질 수 있습니다. 따라서 실제 상황에 따라 적절히 사용해야 합니다.