Как перечислить каждый цикл forEach в HTML
Я пытаюсь вывести результаты своего цикла forEach один за другим в виде списка в HTML, для которого я использовал:
object = {
food1 : [potato, tomato, carrot]
}
object[food1].forEach(function (item){
var text = "";
text += item;
$("#ulelement").html("<li>" + text + "</li>");
})
В настоящее время это приводит к добавлению элемента списка в мой html с последним запуском forEach, который является " морковью ". Чего я хотел бы добиться, так это дать мне 3 элемента списка: картофель помидор морковь
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 2
Если я правильно понимаю, вы хотите, чтобы ulelement содержал все созданные li элементы, а не только последний, если это так, вы можете использовать .reduce, вот пример:
ulelement.html(object[array].reduce((a, c) => `${a}<li>${c}</li>`, ""))
Вы можете найти более подробную информацию о .reduceЗДЕСЬ
Кроме того, в этом примере я использовал литерал шаблона, вы можете найти подробности об этом ЗДЕСЬ
В точку, сэр! это именно то, что я искал, спасибо! Мне также нужно будет изучить, как это работает. Спасибо
Когда вы вызываете .html(), вы перезаписываете эффект предыдущей итерации, поэтому на выходе вы получаете только последнее значение.
Вы можете использовать .append():
$("#ulelement").append("<li>" + text + "</li>");
Примечание: лучше использовать jQuery в полной мере, чтобы избежать проблем с кодировкой символов:
$("#ulelement").append($("<li>").text(text));
Чтобы сбросить список в начале, добавьте этот до в цикл:
$("#ulelement").empty();
Это также отлично сработало, однако единственная причина, по которой .reduce послужила мне лучше, заключается в том, что мне нужно заменить его, когда я изменяю значение. Несмотря на это, большое спасибо, это также еще одна новая вещь для меня!
Немного сложно понять, что на самом деле здесь спрашивают. Пожалуйста, отредактируйте свой вопрос и уточните, что не работает и как вы этого хотите.