Почему некоторые из моих входных данных считаются узлами, а другие нет?

#javascript

#javascript

Вопрос:

У меня есть задача, в которой мне нужно динамически генерировать входные данные для временных интервалов. Я могу генерировать интервалы, но когда я пытаюсь присоединить входные данные к форме для отправки, четные индексы входных данных считаются узлами, но я получаю сообщение об ошибке, в котором говорится, что добавление дочернего элемента не работает для неузла. Почему некоторые рассматриваются как узлы, а другие нет?

Не обращайте внимания на то, что оператор if всегда выполняется, я удалил некоторую проверку ошибок, чтобы узнать, была ли это проблема. Извините, если это глупый вопрос. Я никогда раньше не использовал javascript.

    function validateForm() {
               var container, inputs, index, flag;
               flag = 0;
               container = document.getElementById('container');
               inputs = container.getElementsByTagName('input');
               form = document.createElement('form');
               if (flag == 0) {
                   form.appendChild(inputs);
                   document.body.appendChild(form);
                   form.submit();
                   alert("Your schedule has been validated and saved! Go to View Schedule to see your new schedule, or Upload Schedule to push it to the Scheduler");
               }
           }
           function addFields() {
               var number = document.getElementById("member").value;
               if (number > 24) {
                   number = 24;
               } else if (number < 1) {
                   number = 0;
               }
               var container = document.getElementById("container");
               while (container.hasChildNodes()) {
                   container.removeChild(container.lastChild);
               }
               if (number > 0) {
                   container.appendChild(document.createTextNode("Start"   "u2002".repeat(8)   "End"));
                   container.appendChild(document.createElement("br"));
               }
               for (i = 0; i < number; i  ) {
                   var input = document.createElement("input");
                   input.type = "time";
                   input.name = "start"   i;
                   container.appendChild(input);
                   container.appendChild(document.createElement("br"));
               }
               if (number > 0) {
                   var x = document.createElement("button");
                   x.innerHTML = "Save";
                   container.appendChild(x);
                   x.addEventListener("click", validateForm);
               }
           }
       
   ```
 

Комментарии:

1. в какой строке это происходит и каково точное сообщение об ошибке?

2. inputs = container.getElementsByTagName('input'); и form.appendChild(inputs); <— попытка добавить html-коллекцию, а не один узел.

3. «Неперехваченная ошибка типа: не удалось выполнить ‘appendChild’ на ‘Node’: параметр 1 не имеет типа ‘Node», он встречается в «form.appendChild (inputs);» в первой функции.

Ответ №1:

Проблема appendChild в том, что ожидается один узел, но вы не передаете ему ни одного узла. Вам нужно будет перебирать входные данные и добавлять их каждый, также используйте querySelectorAll

 inputs = container.querySelectorAll('input');

inputs.forEach(function(input){
   form.appendChild(input)
})
 

Комментарии:

1. Большое вам спасибо!