WEATHER APP background img code doesn't work

WEATHER APP background img code doesn't work
0

#1

i want to change the background due to the temp,but it didn’t work.
this is the code

function changeBackgroundImage(){
  var fah=document.getElementById("temp").innerHTML;
  fah = parseInt(fah);
  if(fah > -10 && fah <= 0){
   document.body.style.backgroundImage='url(img/rain.jpg)';
  }else if(fah > 1 && fah <= 15){
   document.body.style.backgroundImage="url(img/rain.jpg)";
  }else if(fah > 16 && fah <= 30){
   document.body.style.backgroundImage="url(img/sun.jpg)";
  }else if(fah > 31){
   document.body.style.backgroundImage="url('https://images.pexels.com/photos/66997/pexels-photo-66997.jpeg?auto=compress&cs=tinysrgb&h=350')";
  };
 
}

#2

The function seems like it would work, but I can not see your html to validate what the element with id=“temp” has in it. Also, how are you calling this function? I do not see where you are actually calling the changeBackgroundImage function in the code you provided.

If you can provide a link to your project (Codepen, JSFiddle, Github, etc.), then we can give you more feedback.


#3

Thank you very much for your help.this is the code pen https://codepen.io/monaalzant/pen/KoYpyY
the app works fine in chrom but it doesnt work in the codepen ,
thank you


#4

The Codepen version uses jQuery syntax, but you did not add jQuery to the project. You need to click on the little gear in the JS Module of Codepen and add the jQuery CDN to your project.

Once you add the jQuery library, you will see the following error in your browser’s console:
Uncaught TypeError: Cannot read property ‘description’ of undefined.

This error is caused by the fact that you are trying to reference a description property (on line 42 of the pen) of data.alerts. However, since there is no property named alerts contained in the data object, you are trying to reference a property of undefined. Since undefined does not have properties, you get the error.

You need to review the JSON response returned, because I do not see an alerts property anywhere in the JSON response.