getting numbers from multiple text boxes (loop) and writing an equation

Question

I am wondering why this loop works even when I add extra variables because I am curious. I only expected numbers1 to work in the loop. Sorry I am new to Javascript

Answer 1

It works regardless of how many fields you add because you're using getElementsByName to get the fields with name="s" and name="a" , which will find all of the fields with those names regardless of how many there are, and you're using a loop.

Note, though, that your output will always only be last pair of results because you're assigning to the #sum element's innerHTML .

Answer 2

I don't understand what you don't understand. The program sums the values in the elements named "s" and "a".

It uses one loop to sum them together at the same time, which is a bad idea: it only works if there are equal number of elements.

Separate the two:

function sumElementsByName(name) {
    var texts = document.getElementsByName(name);
    var sum = 0;
    for (var i = 0; i < texts.length; i++) {
        sum += parseInt(texts[i].value || 0);       
    }
    return sum;
}

document.getElementById("btn").addEventListener("click", function() {
    var sum_s = sumElementsByName("s");
    var sum_a = sumElementsByName("a");
    document.getElementById("sum").innerHTML = sum_s + " and " + sum_a;
});