Reload image without refreshing page

December 2, 2022

I have little experience with javascript, I’m trying to make the image update but I’m not succeeding. This image comes through an API

image here

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js">

<script type="text/javascript">

   window.onload = function(){

      setInterval("atualizarqr()",3000); // troca imagem a cada 3 segundos      

   }

   function atualizarqr(){

      var img = document.getElementById('img').src;     

     
         document.getElementById('img').src = "https://santoaleixo.com.br/wp-content/uploads/2018/11/Logo-Santo-Aleixo-3.png";
   }

</script>

<body onload="atualizarqr">
            <img src="" id="img"/>
        </body>

>Solution :

A couple of issues with this code:

You create an img variable but do not use it. You can just remove the variable declaration altogether
You are passing in the function to setInterval but as a string, which is incorrect

Here is the updated code:

function atualizarqr() {
  document.getElementById("img").src = "https://santoaleixo.com.br/wp-content/uploads/2018/11/Logo-Santo-Aleixo-3.png";
}

window.onload = function () {
  // troca imagem a cada 3 segundos
  setInterval(atualizarqr, 3000);
};