Не работает код Js — как сделать, чтобы при нажатии на кнопку всегда выполнялось добавление элементов на html — страницу?

Question

[MargoKomilfo]

btnAdd1.addEventListener("click", function() {
  var newDiv = document.createElement("div");
  var divContent =`<input class="expenses-item" type="text" placeholder="Наименование"><input class="expenses-item" type="text" placeholder="Цена">`;
  newDiv.appendChild(divContent);
  document.getElementById("addel1").appendChild(newDiv);
});

Answer 1

[Сергей Соколов]

в переменной var divContent у вас строка текста (пусть и HTML).
в следующей строке appendChild() ожидает не строку текста, а HTML узел (Node) – его можно создать как у вас выше document.createElement().

В общем два пути:
1. Создавать HTML, но тогда приклеивать его через element.innerHTML = myHTML;
2. Создавать узлы и их через appendChild() Но у вас требуется два инпута вставить, с множеством атрибутов. На чистом JS это займет несколько строк:

spoiler

var input = document.createElement('input');
input.type = "text";
input.placeholder = "Наименование";
input.className = "expenses-item";
newDiv.appendChild(input);

input = document.createElement('input');
input.type = "text";
input.placeholder = "Цена";
input.className = "expenses-item";
newDiv.appendChild(input);

Comments

[MargoKomilfo]

спасибо большое - разобралась, все работает. =) +1 в вашу карму =))