0

请阅读并尝试下面的代码。点击“foo”段落。查看浏览器控制台，我没有看到预期的结果，而如果我点击“栏”，我会看到。

为什么会这样？

<!DOCTYPE HTML PUBLIC
  "-//W3C//DTD HTML 4.01//EN"
  "http://www.w3.org/TR/html4/strict.dtd">
<html>
  <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8">
  </head>
  <body>
    <div class="root">
      <div>
        <p id="foo">foo</p>
      </div>
      <p id="bar">bar</p>
    </div>
    <script type="text/javascript">
      var p_list = document.getElementsByTagName('P');
      for (var n=0; n<p_list.length; n++) {
        p_list[n].onclick = function() {
          console.log('ONCLICK - id: ' + this.id + ' - ' + getC( this ) + '\n');
        };
      }
      function getC( P ) {
        if (P.parentNode.className === 'root') {
          console.log('INSIDE FUNCTION - id: ' + P.id + ' - ' + P.parentNode);
          return P.parentNode;
        } else {
          getC( P.parentNode );
        }
      }
    </script>
  </body>
</html>

实时代码：http: //jsbin.com/izuleg/1/edit

4

3 回答 3

2

你只是在你的条款中遗漏了一个return陈述。else它应该是：

...

} else {
    return getC( P.parentNode );
}

请注意，您正在使用递归函数（一个调用自身的函数），因此您可能应该添加额外的预防措施以使其在特殊情况下返回某些内容（例如，没有类“root”的节点），否则您'将获得无限递归和堆栈溢出错误。

于 2013-03-26T14:43:34.263 回答
0

您错过了<div>和</div>标签，请检查：

    <div class="root">
          <div>
            <p id="foo">foo</p>
          </div>
          <div>
            <p id="bar">bar</p>
          </div>
    </div>
于 2013-03-26T14:53:45.910 回答
0

这是你的错误。您应该返回 getC 的结果，而不是仅仅调用它。

function getC( P ) {
    if (P.parentNode.className === 'root') {
      console.log('INSIDE FUNCTION - id: ' + P.id + ' - ' + P.parentNode);
      return P.parentNode;
    } else {
      return getC( P.parentNode );
    }
  }
于 2013-03-26T14:51:40.493 回答