Skip to content
Advertisement

OpenWeather Api Using JavaScript Fetch With User Input Keeps Previous Data in HTML Page

I’m using JavaScript Fetch to get Data from OpenWeather Api. I have a form for users to input the City whose weather information they want to see. For some reason, the data from the previous city still pops up in the HTML page instead of disappearing for the new data to take its place. How do I clear the memory so that the new weather info from the newly searched city remains in the page? Below is the code for both JS and HTML

JavaScript

HTML form

JavaScript

Advertisement

Answer

The insertAdjacentHTML() method of the Element interface parses the specified text as HTML or XML and inserts the resulting nodes into the DOM tree at a specified position. It does not reparse the element it is being used on, and thus it does not corrupt the existing elements inside that element. This avoids the extra step of serialization, making it much faster than direct innerHTML manipulation.

JavaScript
JavaScript
User contributions licensed under: CC BY-SA
3 People found this is helpful
Advertisement