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

これがあなたの間違いです。getCを呼び出すだけでなく、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 に答える
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 に答える