Javascript variables using loop

Question

I have some input elements like

<input type="text" name="d1">
<input type="text" name="d2">

and so on

<input type="text" name="d10">

Now I would like to select all of them for some javascript query document.form_name.d1 through document.form_name.d10, using a for loop, so that I dont have to write each one of them separately. How to do this?

Thanks u_mulder and Nikita. Will try both and get back to you guys. — RON
– RON, Commented Oct 15, 2019 at 9:54

u_mulder · Accepted Answer · 2019-10-14 07:23:40Z

1

Add some class to your inputs and use getElementsByClassName:

var inputs = document.getElementsByClassName('text-input');
for (var i = 0; i < inputs.length; i++) {
    console.log(inputs[i].value);
}

<input type="text" name="d1" class="text-input" value="value 1">
<input type="text" name="d2" class="text-input" value="value 2">
<input type="text" name="d3" class="text-input" value="value 3">
<input type="text" name="d4" class="text-input" value="value 4">
<input type="text" name="d5" class="text-input" value="value 5">

answered Oct 14, 2019 at 7:23

u_mulder

54.8k5 gold badges54 silver badges72 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Eric Over a year ago

I think this solution is better than Nikita's because it is more scalable. This avoids "name" having 2 responsibilities (naming the field, and knowing if this field should be taken from its list). Imagine that the names of the fields change, or that its selection should not contain d2, but d1 and d3, etc ...)

Nikita Bulanakov · Accepted Answer · 2019-10-14 07:30:15Z

1

Also, you can use javasctipt querySelectorAll to get all elements starts with "d"

document.querySelectorAll("[name^=d]");

answered Oct 14, 2019 at 7:30

Nikita Bulanakov

1682 silver badges10 bronze badges

1 Comment

RON Over a year ago

Thanks u_mulder and Nikita. Will try both and get back to you guys.

Collectives™ on Stack Overflow

Javascript variables using loop

2 Answers 2

1 Comment

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related