Как сделать так, чтобы пользователь сам вводил нужное количество input в js

Есть вот такой код, нашёл его на этом сайте, он выводит массив из input на страницу:

function srt() {
  var d = document,
    inp = d.getElementsByClassName('field'),
    mas = [];

  function save() {
    for (var i = 0; i < inp.length; i++) {
      mas[i] = inp[i].value;
    }
    console.log(mas);
  }
  save();
}srt();


Но я хочу, чтобы пользователь сам мог вводить нужное ему количество выводящихся input, а не записывал отдельно в html каждый input, как в этом коде:

<input type="text" class="field" value="a" />
<input type="text" class="field" value="b" />
<input type="text" class="field" value="c" />

Уже перепробовал много методов и пока не получилось найти ответ самому(


Ответы (1 шт):

Автор решения: Aleksandr Belous
// функция генерации инпута
const makeInput = () => {
  const el = document.createElement('input');
  el.type = 'text';
  el.className = 'my-class';
  return el;
};

// функция генерации массива элементов из необходимого количества. Такая запись позволяет использовать разные функции-конструкторы.
const generateElementsList = (count, constructor) => {
  return Array(count).fill().map(constructor);
};

// создаем элементы
const inputs = generateElementsList(10, makeInput);
// добавляем на страницу
document.body.append(...inputs);
→ Ссылка