innerHTML не получает вызов при использовании getElementsByClassName

Question

У меня есть куча абзацев с именем класса «display». То, что я пытаюсь сделать, это получить входные значения формы (форма - это имена «inputForm») и назначить их абзацам через innerHTML. Проблема в том, что цикл for никогда не выполняется.

Любая помощь будет высоко оценена. Благодарю.

function displayFormInput() { 
    var formElements = document.forms["inputForm"].getElementsByTagName("input"); 
    var elements = document.getElementsByClassName('display'); 
    for (var i; i < elements.length; i++) { 
     elements[i].innerHTML += formElements[i].value; 
     alert(i); // never gets called 
    } 
} 

Answer 1

Вы забыли инициализировать i к нулю в пределах вашей для операторов цикла.

Попробуйте это вместо того, чтобы для вашего цикла:

for (var i=0; i < elements.length; i++) { 
    elements[i].innerHTML += formElements[i].value; 
    alert(i); // never gets called 
} 

Answer 2

В выражении инициализации передачи контура, вы объявляете переменную i без присвоения ему значения, что означает, что это значение установлено в undefined. Поэтому условие цикла всегда неверно: undefined < elements.length, поэтому инструкция никогда не выполняется.

for ([initialization]; [condition]; [final-expression]) 
    statement 

Вы это исправить, объявив переменную и присвоить ей значение: var i = 0.