Question

我想遍历网页中的所有元素，但是，它会挂起。我发现它循环了最后一个＆lt; p＆gt;和＆lt; strong＆gt;元素重复。我试图在Firefox和Chrome的调试器中找到问题，但是，我找不到根本原因。

这是我的代码：

<html>
    <head>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    </head>
    <body>
        kkjlkjjklk
        <div id=qq>
            sdfsdfdfdssdfsdf
        <p id="demo">Click the button get info about 
            the body element's child nodes</p>
        </div>
        <button onclick="myFunction()">Try it</button>
        <p id=jj>
            <strong>Note:</strong> Whitespace inside elements is considered as text, and text 
            is considered as nodes.
        </p>

        <script>
        function showElementInfo(e)
        {
            var result="";
          var c=e.childNodes;
          for (i=0; i<c.length; i++)
          {
            data=jQuery.trim(c[i].textContent);
            switch (c[i].nodeName)
            {
                case "BUTTON":break;
              case "SCRIPT":break;
                default:
                                if (c[i].childNodes.length==3)
                                    showElementInfo(c[i]);
                                else
                                    console.log("parent="+c[i].parentNode.nodeName+","+c[i].nodeName+":"+data+","+c[i].childNodes.length);
                                break;
            }
          }
        }
        function myFunction()
        {
         var txt="";
         showElementInfo(document.body);
         //showElementInfo(document.getElementById("jj"));
        }
        </script>
    </body>
</html>

非常感谢

Answer 1

它挂起了。我发现它重复循环了最后一个<p>和<strong>元素，但是，我找不到根本原因。

您的i变量为implicitly global。当你进行递归时，它将覆盖外部调用中的计数器变量，并且每当子节点的数量小于当前i时，您将陷入无限循环。

经验教训：始终使用var declarations，并尽早使用strict mode警告错误。

为什么浏览器挂起我的Javascript函数？

1 个答案: