Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Заменить элементы forecast weather (https://javascript.ru/forum/misc/79057-zamenit-ehlementy-forecast-weather.html)

Tery_lida 11.12.2019 20:52

Заменить элементы forecast weather
 
Вложений: 1
Здравствуйте. Подскажите пожалуйста насчет такого вопроса.
разрабатываю приложение погоды. Я использую вот эти иконки погоды
Приложение должно запускаться и сразу показывать погоду в течение 24 часов и иконку погоды текущего расположение пользователя. С этим пунктом вопросов нет.
Использую такую функцию
function forecastcity(city) {
  fetch(`https://api.openweathermap.org/data/2.5/forecast?q=${city}&APPID=`)
    .then((response) => response.json())
    .then((data) => {
      data.list.slice(0, 8).map((day, i) => {
        const div = document.createElement('div');
        const h2 = document.createElement('h2');
        const p1 = document.createElement('p');
        const icon = document.createElement('i');
        const p2 = document.createElement('p');
        icon.className = icons(day.weather[0].icon);
        icon.id = 'forecasticon';
        div.appendChild(p2);
        div.appendChild(h2);
        div.appendChild(p1);
        div.appendChild(icon);
        p1.innerHTML = day.weather[0].description.toLowerCase().replace(/\b[a-z]/g, (letter) => letter.toUpperCase());
        forecastTemp.push(day.main.temp);
        h2.innerHTML = covertF(day.main.temp);
        h2.id = i;
        div.className = 'days';
        const final = document.getElementById('forecast').appendChild(div);
        p2.innerHTML = timeConverter(day.dt);
        return final;
      });
    });
}



Данные forecast отображаются отлично. Дальше мне надо отобразить погоду в городе, который вводится через поле поиска. И вот тут начинаются проблемы.
Данные дублируются. Т.е. к действующим 8ми элементам добавляется еще 8 новых. Подскажите пожалуйста, как заменить предыдущие элементы погоды forecast при каждом поиске города?

рони 11.12.2019 22:00

Цитата:

Сообщение от Tery_lida
const final = document.getElementById('forecast').appendChild(di v);

document.getElementById('forecast').innerHTML = div.innerHTML

Tery_lida 12.12.2019 07:07

Цитата:

Сообщение от рони (Сообщение 517343)
document.getElementById('forecast').innerHTML = div.innerHTML

Спасибо большое, но к сожалению не работает

рони 12.12.2019 08:21

Tery_lida,
тогда так
document.getElementById('forecast').innerHTML = "";
const final = document.getElementById('forecast').appendChild(div);

Tery_lida 12.12.2019 08:59

Вложений: 2
Спасибо.
Но вместо 8ми элементов отображается один.

рони 12.12.2019 09:04

Цитата:

Сообщение от рони
document.getElementById('forecast').innerHTML = "";

перенесите в начало строки 5

Tery_lida 12.12.2019 09:21

Спасибо огромное! Теперь все работает!


Часовой пояс GMT +3, время: 17:25.