javascript - 为什么在 JavaScript 中使用 foreach 访问节点列表子元素会导致未定义

Question

这个问题已经有答案了:

Why does JavaScript variable declaration at console results in "undefined" being printed? (4 个回答)

已关闭 去年。

我正在尝试使用 foreach 迭代 NodeList。当我尝试使用以下代码进行访问时，控制台中出现未定义的情况。

foreach = Array.prototype.forEach;
cls= document.getElementsByClassName('classname')
foreach.call(cls,function(some)
{
var ok = some.children;
foreac.call(ok,function(ss)
{
ss
});
});

我正在 Chrome 开发者工具中尝试此代码。控制台返回“未定义”。我可以通过显式指定列表位置来访问。

Answer 1

你会得到未定义，因为基本上你没有对结果做任何事情。您可以返回或者例如将其记录到控制台。

var foreach = Array.prototype.forEach,
    cls = document.getElementsByClassName('classname');

    foreach.call(cls, function(some) {
      var ok = some.children;
      foreach.call(ok, function(ss) {
        console.log(ss);
      });
    });

<ul class='classname'>
  <li>1</li>
  <li>2</li>
  <li>3</li>
</ul>

无论如何，我不确定你这样做是否只是为了学习目的，但你让事情变得复杂了。

使用 querySelectorAll 获取指定元素并使用 Array#forEach 迭代它不是更容易吗？

var elems = document.querySelectorAll('ul li');
    elems.forEach(v => console.log(v));

<ul class='classname'>
  <li>1</li>
  <li>2</li>
  <li>3</li>
</ul>