GetElementsByName包含名称之类的数组

Question

当我命名我的控件以便在POST或GET中获取数组时,我经常使用这种表示法.

<input name="color[1]" type="text" />
<input name="color[2]" type="text" />
<input name="color[3]" type="text" />

所以在我的脚本中我能做到

<?php $data=$_GET["color"]; 
for each ($color as $key=>$value) {
   doSomething();
} ?>

经常发生我需要在javascript中获取这些id,但我无法得到它们,所以我经常为html中的每个元素添加一个ID,就像那样

<input name="color[3]" id="color_3" type="text" />

这样我就可以使用document.getElementsById('color_3')

相反,我想找到使用document.getElementsByName(color [3])的方法...但我无法真正让它工作.

有帮助吗？

Answer 1

如果您想要所有颜色输入,可以使用querySelectorAll来查询name属性:

document.querySelectorAll("input[name^='color[']")

这将查看inputname属性以其开头的所有标记的文档color[.这是一个小提琴.

如果您只想要color[3],可以使用:

var color3 = document.getElementsByName("color[3]");
console.log(color3[0]);