Как получить конечный результат работы цикла for?

Question

[vnordan]

День добрый всем.

Есть у меня простенькая таблица из динамического количества полей , и хочу я просуммировать все значения этих полей. Делаю следующим образом:

<script>
  var arr = document.getElementsByTagName('input'); //делаю массив из всех тегов <input>
  var s = 0;
  for(i = 1; i <= arr.length; i++){
      var x = parseInt(arr[i].value, 10); //каждый шаг цикла беру очередное значение поля таблицы, делаю из него integer
      var s += x; // суммирую это значение к общему результату
      document.write('Шаг= ', i, ' ', 'Сумма= ', s, '<br>'); // вывожу на экран промежуточное значение суммы
      }
</script>

Всё работает, всё хорошо. Но как только я хочу перестать выводить промежуточное значение, а вывести сразу конечный результат, и делаю так:

<script>
  var arr = document.getElementsByTagName('input'); //делаю массив из содержимого всех тегов <input>
  var s = 0; //начальное значение суммы всех значений
  for(i = 0; i < arr.length; i++){
      var x = parseInt(arr[i].value, 10); //каждый шаг цикла беру очередное значение поля таблицы, делаю из него integer
      var s += x; // суммирую это значение к общему результату
      }
  document.write('Сумма= ', s); // хочу вывести конечный результат работы скрипта
</script>

- на экран не выводится вообще ничего. Где я ошибаюсь?

Answer 1

[Денис]

В цикле не нужно инициализировать переменную "s", вы это сделали до цикла.
P.S. document.write - вещь специфическая, поэтому, в вашем случае, лучше использовать какой-то другой способ вывода: innerHTML, textContent, insertAdjacentHTML и т.д.

Comments

[vnordan]

Боюсь, что дело не в document.write
Сделал так:
<div id="summ"> </div>

<script>
  var arr = document.getElementsByTagName('input');
  var s = 0;
  for(i = 0; i < arr.length; i++){
      var x = parseInt(arr[i].value, 10);
      s += x;
      }
  document.getElementById('summ').innerHTML = "Произвольный текст";

- не работает.
Стоит же поставить innerHTML перед for:

<script>
  var arr = document.getElementsByTagName('input');
  var s = 0;
  document.getElementById('summ').innerHTML = "Произвольный текст";
  for(i = 0; i < arr.length; i++){
      var x = parseInt(arr[i].value, 10);
      s += x;
      }

- всё нормально, срабатывает.

[Денис]

Боюсь, что дело не в document.write

А я вам раве писал, что дело в этом? Я вам написал, что в цикле инициализировать переменную не нужно. И вот в этом как раз и причина.

[vnordan]

Инициализирую я там эту переменную, или нет - на результате это никак не сказывается.

[Денис]

vnordan неужели? Давайте посмотрим на ваш код с двумя поправками:
1. Не инициализируем переменную внутри цикла, как я говорил
2. Для вывода используем insertAdjacentHTML. Хотя опять повторюсь, что вывод тут значения не имеет.
Остальной код - весь ваш и без други правок, даже комменты оставил. Всего одна правка, на которую я указывал в самом начале и работат, как Биг Бэн

[vnordan]

Да, вы совершенно правы, всё так и есть. Только ошибка была не только в этом. Оказывается у формы в конце есть одно скрытое поле, которое не надо суммировать, и надо было делать i < arr.length-1; , а не i < arr.length; В любом случае, спасибо )

Answer 2

[Олег]

http://codepen.io/werty1001/pen/grvQWM

Comments

[vnordan]

А как сделать это же, но без CoffeeScript?

[Олег]

vnordan: Нажмите на "View Compiled" и будет просто js