Symbol.iterator 不是表单元素上的函数答案

【问题标题】：Symbol.iterator is not a function on form elementSymbol.iterator 不是表单元素上的函数
【发布时间】：2016-03-18 15:31:50
【问题描述】：

尝试使用 for..of 和 Babel 迭代 <form> 元素时出现以下错误：

test[Symbol.iterator] 不是函数。（在 'testSymbol.iterator', 'test[Symbol.iterator]' 未定义）

我在页面上有babel-polyfill。遍历NodeList、Array 和其他元素都可以，问题似乎出在<form> 元素上。

以下代码在 Chrome v49 中运行良好：

for(const x of test) {
console.log(x);
}

<form id="test">
  <input>
  <input>
  <input>
</form>

但是，在需要 polyfill 的浏览器中，我收到错误消息。这是重现该问题的jsFiddle。

哪个实现是正确的？这是 babel-polyfill 中的错误吗？

【问题讨论】：

嗯，规范没有列出 HTMLFormElement 是可迭代的（而不是 NodeLists）：html.spec.whatwg.org/multipage/forms.html#the-form-element。但也许每个具有 getter 的元素默认都是可迭代的？
@FelixKling 感谢您提供规范参考。看起来这就是它的实现方式，但是从形式本身来看，elements 应该都不是可迭代的。
然而，我记得在某处读过一些关于 DOM 元素和可迭代对象的内容。很可能这是某种隐含的“指定”。我会继续寻找......

【解决方案1】：

我和你有同样的问题。

最后，我是这样解决的：

const List= document.querySelectorAll('.my-class');
for(let i=0,i<List.length,i++){
   console.log(List.item(i))
}

出错的代码：

 const List= document.querySelectorAll('.my-class');
for(let i of List)
{
    console.log(i);
}

【讨论】：