Javascript-форум - калькулятор для расчета стоимости

Ребят. извините что дублирую подобную тему) но вопрос немного другой теперь.

Есть форма.

<form>

<p><input name="itemtype1" id="a" type="radio" value="10"> Значение (A=10)</p>
<p><input name="itemtype1" id="b" type="radio" value="20"> Значение (B=20)</p>
<p><input name="itemtype1" id="c" type="radio" value="30"> Значение (C=30)</p>

<p><input type="checkbox" name="itemtype2" id="d" value="10"> <label>Значение (D=10)</label></p>
<p><input type="checkbox" name="itemtype2" id="e" value="20"> <label>Значение (E=20)</label></p>

<select name="itemtype3" id="f">
<option value="100">Значение (F=100)</option>
<option value="200">Значение (F=200)</option>
<option value="300">Значение (F=300)</option>
</select>

<p><input type="text" name="itemtype4" id="g" value="0"> Значение (G=по умолчанию 0, число будет введенно в ручную)</p>

<p>Итого: <output name="o" for="a b c d e f g">0</output></p>
</form>

Как видите в ней разные поля. Такие как: text,radio,checkbox и select и в каждой из них свои "целые" единичные значения.

Задача состоит в том что нужно сложить знаком "+" эти значения и вывести их итоговую сумму.

Подскажите пожалуйста готовое решение для такой операции. Желательно такое чтобы в случае надобности добавить новый input или select, я могла легко дописать его в скрипт..

Прошу только без сложных ботанческих выражений) я новичек. вы мужики в конце концов?) помогите даме. уже целый день потратила на это))

<!DOCTYPE html> <html> <head> <title>Untitled</title> <meta charset="utf-8"> <style type="text/css"> </style> </head> <body> <form> <p><input name="itemtype1" id="a" type="radio" value="10"> Значение (A=10)</p> <p><input name="itemtype1" id="b" type="radio" value="20"> Значение (B=20)</p> <p><input name="itemtype1" id="c" type="radio" value="30"> Значение (C=30)</p> <p><input type="checkbox" name="itemtype2" id="d" value="10"> <label>Значение (D=10)</label></p> <p><input type="checkbox" name="itemtype2" id="e" value="20"> <label>Значение (E=20)</label></p> <select name="itemtype3" id="f"> <option value="100">Значение (F=100)</option> <option value="200">Значение (F=200)</option> <option value="300">Значение (F=300)</option> </select> <p><input type="text" name="itemtype4" id="g" value="0"> Значение (G=по умолчанию 0, число будет введенно в ручную)</p> <p>Итого: <output name="o" for="a b c d e f g">0</output></p> </form> <script> window.addEventListener('DOMContentLoaded', function() { var form = document.querySelector('form'), elem = form.querySelectorAll('[name^="itemtype"]'), output = form.querySelector('output'); function total() { output.innerHTML = [].reduce.call( elem, function(sum, el) { var n = (+el.value||0) * (el.checked || el.tagName == "SELECT" || el.type == "text"); return sum + n },0); } form.addEventListener('change', total); form.addEventListener('input', total); }); </script> </body> </html>