Я довольно новичок в JavaScript и столкнулся с проблемой, которая, вероятно, показывает мою наивность :( Вот упрощенная версия:
У меня есть массив и функция, которая автоматически создает новый <p>
для каждого элемента массива, чтобы отобразить его содержимое на странице. У меня также есть кнопка, которая вызывает функцию для добавления нового элемента в массив. Я ожидал, что начальная функция распознает, когда массив изменяется, и динамически создать новый
для нового элемента. Конечно, однако, это не так. Как мне это сделать?
Я знаю, что я мог бы просто установить функцию, которая выполняется при нажатии кнопки, чтобы добавить новый
содержит сам новый элемент, но это кажется не элегантным и может также вызвать у меня проблемы в дальнейшем. Кажется, что я ищу какое-то «обновление» исходной функции. Любые предложения действительно приветствуются :) Спасибо большоеЗаранее!
Вот код (JS fiddle также связан ниже):
const array = ['a', 'b', 'c', 'd'];
function populate() {
let i;
for (i = 0; i < array.length; i++) {
let para = document.createElement('p');
para.innerText = array[i];
let container = document.getElementById('container');
container.appendChild(para);
}
}
populate();
document.getElementById('button').addEventListener("click", function addToAray() {
array.push('e')
console.log(array);
});
https://jsfiddle.net/willgph/sj6duz92/4/