javascript - 如何从Javascript中的表单树中挑选出所有输入子项？

Question

我正在处理使用 Javascript 进行验证的表单。为了组织和格式化输入，我需要使用div, table,span等。当我尝试获取所有表单信息时，这会给我带来问题。现在，我有一个脚本循环遍历父级（表单）的所有子级，并相应地执行操作。不幸的是，因为现在都涉及那些讨厌span的 , div, table,tr和td元素，所以我无法使用.childNodes. 我该怎么做呢？

Answer 1

表单元素的“元素”属性给出了表单中所有输入（等）的列表。那是，

var form = document.forms[0]; // or getElementById() ..
var elements = form.elements;
for (var i = 0; i < elements.length; ++i) {
  var element = elements[i];
  // do something with form element
}

表单中有多少非表单包装元素无关紧要，因此无论您的 HTML 标记如何，它都有效。编辑——这也适用于不支持“querySelector”API 的旧浏览器。

Answer 2

使用:input选择器：（http://api.jquery.com/input-selector/）

Answer 3

如果您使用的是 jQuery：$('#parentElement').find('input')

Answer 4

使用querySelectorAll：

document.querySelector('#parentElement').querySelectorAll('input')

文档：querySelector，querySelectorAll。

这两个函数也可以在元素上运行。浏览器兼容性在文档中。