Задать вопрос
@tery-lida
javascript

Почему некорректно отображаются иконки погоды?

Здравствуйте. Подскажите пожалуйста насчет такого вопроса.
разрабатываю приложение погоды. Я использую вот эти иконки погоды
Приложение должно запускаться и сразу показывать погоду и иконку погоды текущего расположение пользователя. С этим пунктом вопросов нет.
Использую вот этот код 
function coords(lat, long) { 
fetch(`url`) 
.then((response) => response.json()) 
.then((data) => {
const icon = document.createElement('i');
icon.className = icons(data.weather[0].icon);
icon.style.fontSize = '120px';
document.getElementById('icon').appendChild(icon);)}


Дальше мне надо отобразить погоду в городе, который вводится через поле поиска. И вот тут сама иконка не работает. Если использовать данный код, то к существующей иконке погоды добавляется новая.
5defd9791b8eb073341005.jpeg

Пробовал через InnerHtml - отображается числовой код иконки и все
5defd99dad67a232378983.jpeg

Подскажите, что я делаю не так ?
  • Вопрос задан
  • 101 просмотр
Комментировать
Подписаться 1 Простой Комментировать
Решения вопроса 2
Get-Web
@Get-Web Куратор тега JavaScript
Front-End Developer
Если я правильно понял, перед
document.getElementById('icon').appendChild(icon);
Просто очищайте icon
document.getElementById('icon').innerHTML = "";
Что-то вроде этого:

function coords(lat, long) { 
fetch(`url`) 
.then((response) => response.json()) 
.then((data) => {
const icon = document.createElement('i');
icon.className = icons(data.weather[0].icon);
icon.style.fontSize = '120px';
document.getElementById('icon').innerHTML = "";
document.getElementById('icon').appendChild(icon);)}
Ответ написан
Комментировать
Комментировать
joeberetta
@joeberetta Куратор тега JavaScript
Читай: https://epdf.pub/google-for-dummies.html
Ну вы посмотрите как вы вообще вставляете. Вы используете elem.appendChild(icon)
А в свою очередь аппенд - вставка, т.е. ему без разницы что у родителя было до него, он просто вставит, а не заменит содержимое.
Проще всего сделать костыль, чтобы не морочиться:
Вставьте перед последней строчкой:
document.getElementById('icon').innerHTML = ''
Ответ написан
Комментировать
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
Вакансии с Хабр Карьеры
JavaScript разработчик
summer • Ярославль
от 100 000 до 140 000 ₽
Junior JavaScript Developer
КРАФТТЕК • Санкт-Петербург
от 60 000 до 80 000 ₽
JavaScript разработчик
вАйТи
от 5 000 до 25 000 ₽
Ещё вакансии
Заказы с Хабр Фриланса
Доработать клиентское приложение для GTA 5 на C#
20 апр. 2024, в 00:51
1000 руб./за проект
Верстка и логика формы выбора билетов в зале для покупки
20 апр. 2024, в 00:43
10000 руб./за проект
Разработать формирование УПД на Java
20 апр. 2024, в 00:28
20000 руб./за проект
Ещё заказы