javascript - 当元素准备好以其名称作为数组时如何获取 ElementsByTagName

Question

当我想要的元素是一组具有相同名称的元素时，我正在尝试使用 javascript 或 jQuery 获取元素数组，一旦我提交表单就准备好成为数组。

代码更容易理解:

<form>
    <!-- ... -->
    <input name='ciudades[]' id="cb_0" type='checkbox' style="display: none" checked="checked" value="ALICANTE_AER">ALICANTE_AER</input>
    <input name='ciudades[]' id="cb_1" type='checkbox' style="display: none" checked="checked" value="MALAGA_AER">MALAGA_AER</input>
    <input name='ciudades[]' id="cb_2" type='checkbox' style="display: none" checked="checked" value="MALLORCA_AER">MALLORCA_AER</input>
    <input name='ciudades[]' id="cb_3" type='checkbox' style="display: none" checked="checked" value="VALENCIA_AER">VALENCIA_AER</input>
    <!-- ... -->
</form>

我试图通过以下两种方式获取一个包含所有名为“ciudades[]”的元素的数组，但均未成功:

var cb_ciudades = document.getElementsByTagName('ciudades[]');

和

var cb_ciudades = document.getElementsByTagName('ciudades');

但在这两种情况下我都以空数组结尾。怎么做到的？

Answer 1

getElementsByTagName 根据标签名称 工作，例如input 或 div 或 span，而不是 name 属性。

如果你想通过它们的名称获取这些元素，你可以使用querySelectorAll:

var list = document.querySelectorAll('input[name="ciudades[]"]');

querySelectorAll 被所有现代浏览器和 IE8 支持。

或者当您标记您的问题时 jquery:

var $list = $('input[name="ciudades[]"]');