li.innerHTML = p.move.name;
moves.appendChild(li);
});
Есть вот такая функция, прикладываю скрин для общей картины.
Как мне сделать так, чтобы li не клонировался каждый раз, при запуске функции getPokemonData?
не меняйте, а рендерите просто html заново
Сейчас загуглю
а чё гуглить, типа того можно const renderItem = (item) => ` <div class="item"> <img src="${item.img.url}" alt="${item.img.altText}"> <span>${item.title}</span> </div> `;
Либо вот так да, сразу в map html код себе собрать и его 1 раз зарендерить)
moves.innerHTML = ""; pokemonMoves.map((p) => { let li = document.createElement("li"); li.innerHTML = p.move.name; moves.appendChild(li); }); Вот так сделал, вроде все нормально работает, дело в том, что в pokemonMoves входит 4 объекта из более 10-70 штук, и дальше я передаю их в li
const movesElements = pokemonMoves.map( ({ move: { name } }) => Object.assign(document.createElement("li"), { textContent: name }) ); moves.append(...movesElements);
Обсуждают сегодня