Symbol.iterator不是一个函数

Question

<div id="par">
    <span id="a1"></span>
    <span id="a2"></span>    
<div id="par2">     
    <span id="a3"></span>
    <span id="a4"></span>
</div>    
</div>

<script>


var ele = document.querySelectorAll('#par span');    

for( var p of ele ){
    console.log(p);
}


</script>

当我运行此代码时,我看到错误

未捕获的TypeError:ele [Symbol.iterator]不是函数

如何解决这个问题？

Answer 1

转换NodeList到Array为使其在迭代的形式,用Array.from()将其转换.

<div id="par">
  <span id="a1"></span>
  <span id="a2"></span>
  <div id="par2">
    <span id="a3"></span>
    <span id="a4"></span>
  </div>
</div>


<script>
  var ele = document.querySelectorAll('#par span');

  for (var p of Array.from(ele)) {
    console.log(p);
  }
</script>

有关更多信息,请参阅以下问题:HTMLCollection和NodeList是否可迭代？