javascript - 在 Javascript 中混合 HTML id 导致多维数组

我试图将一组 INPUT 元素分组到一个 Javascript 数组中，但我对为什么我得到一个多维数组感到困惑(下面代码中名为“urls”的数组)。原来我把第四个元素和第一个元素的 id 弄混了。

<html>

<head>
    <script language="javascript">
    function validate() {
        var form = document.forms.conf;

        var urls = new Array(form.url1, form.url2, form.url3, form.url4);
        alert(urls[0].value);  // returns 'undefined'
        alert(urls[0][0].value);  // works
    }
    </script>
</head>

<body>

<form name="conf">
    <input type="text" name="url1" id="url1">
    <input type="text" name="url2" id="url2">
    <input type="text" name="url3" id="url3">
    <input type="text" name="url4" id="url1"><br />
    <button type="button" onclick="javascript:validate();">Push me</button>
</form>

</body>
</html

我的问题是，为什么会发生这种情况？ HTML 属性“id”与“document.forms.form_name.element”有什么关系？而为什么会导致它放到一个多维数组中呢？行为似乎也是相同的跨浏览器，所以它必须是一些我不知道的定义。

最佳答案

对于每个具有名称或 ID 的表单控件，表单都有一个属性。该属性的名称将与名称或 ID 相同。如果多个元素共享一个名称(或者非法地共享一个 id)，那么该属性将包含一个 NodeList 而不是单个 HTMLElementNode。

第一个输入的名称(和 ID)url1。最后一个输入的 ID url1

所以 form.url1 变成了一个由这两个元素组成的 NodeList。

关于javascript - 在 Javascript 中混合 HTML id 导致多维数组，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/13193638/