如何使用Javascript迭代n个数组DOM元素

我正在尝试使用Javascript验证表单。验证函数的目的是迭代使用数组格式命名的可变数量的输入元素，以便它们在$\u POST中正确通过。然而，我在用Javascript迭代这些元素时遇到了困难——有人知道如何从简单的Javascript访问这些元素吗

下面是我的验证函数和表单的简化版本，以帮助说明我正在尝试做什么：

<script type="text/javascript">
function validateForm() {
    var vTotal = parseInt(document.getElementById('Total'));
    var subtotal = 0;

    var sub = document.getElementsByName('subqty');
    for ( var i = 0; i < sub.length; i++ ) {
        if ( sub[i].value != "" ) {
            subtotal += parseInt(sub[i].value);
            }
        }

    if ( subtotal != vTotal ) {
        alert("Totals do not match, please check your math and try again.");
        return false;
        }
    }
</script>

....

<form name="test" method="post" action="<?php echo $_SERVER['PHP_SELF']; ?>" onsubmit="return validateForm();">
<input type="text" id="Total" value="100"><br>

<!-- there can be any number of subtotal inputs -->
<input type="text" name="subqty[1]" value="30"><br>
<input type="text" name="subqty[2]" value="10"><br>
<input type="text" name="subqty[3]" value="43"><br>

<input type="submit" value="Check Validation">
</form>

函数validateForm（）{
var vTotal=parseInt（document.getElementById（'Total'）；
var小计=0；
var sub=document.getElementsByName（'subqty'）；
对于（变量i=0；i
var sub = document.querySelectorAll("[name^='subqty']");

更多CSS选择器。
HTML

<form name="test" method="post" action="<?php echo $_SERVER['PHP_SELF']; ?>" onsubmit="return validateForm();">
    <input type="text" id="Total" value="100"><br>
        <div id="subForm">
            <!-- there can be any number of subtotal inputs -->
            <input type="text" name="subqty[1]" value="30"><br>
            <input type="text" name="subqty[2]" value="10"><br>
            <input type="text" name="subqty[3]" value="43"><br>
       </div>
    <input type="submit" value="Check Validation">
</form>

没有一个元素具有名称
子数量
，因此没有匹配项。只需给元素一个公共类，然后使用它。Javascript和HTML并不真正关心“array named”元素，只有PHP（和其他一些服务器端语言）关心。此外，分组输入通常用于单选按钮等，对于文本输入，您真的应该只使用常规名称。@adeneo分组将通过给它们相同的名称来完成，这里的情况无论如何都不是这样。对任意多个输入进行索引是一种常见的方法，例如在列表中。@adeneo谢谢，这确实有效-切换到GetElementsByCassName（），并为元素分配了一个公共类。Bergi是对的，在这种情况下，将输入命名为数组是必要的，因为它是一种动态形式，可以根据用户的操作进行收缩或增长
function validateForm() {
    var vTotal = document.getElementById('Total').value;
    var subtotal = 0;

    var sub = document.querySelectorAll('#subForm input');
    for ( var i = 0; i < sub.length; i++ ) {
        if ( sub[i].value != "" ) {
            subtotal += parseInt(sub[i].value);
        } else {
            alert('Please fill all fields!');
        }
    }

    if ( subtotal != vTotal ) {
        alert("Totals do not match, please check your math and try again.");
        return false;
        } else {
            alert('Everything is wright!');
            return true;
        }
    }