您的位置：首页 > Web前端 > JavaScript

Javascript 递归打印Document层次关系

2013-01-25 11:01 344 查看

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

    <title>递归显示节点层次关系</title>

    <script type="text/javascript">

        var ResultStr = "";

        function ListNode(node,level) {

            PrintInfo(node, level);

            level++;

            var nodes = node.childNodes;

            for (var i = 0; i < nodes.length; i++) {

                if (nodes[i].hasChildNodes()) {

                    ListNode(nodes[i], level);                   //递归
                }

                else {

                    PrintInfo(nodes[i], level);

                }

            }

        }

        function getSpace(level) {

            var s = "";

            for (var i = 0; i < level; i++) {

                s+="!----"

            }

            return s;

        }

        function PrintInfo(node, level) {

            ResultStr += getSpace(level) + "Name:" + node.nodeName +

                                "...Type:" + node.nodeType + "...Value:" + node.nodeValue + "<br />";

        }

        function getDocAllInfo() {

            ResultStr = "";

            ListNode(document, 0);

            document.write(ResultStr);

        }

    </script>

</head>

<body>

    <input type="button" value="测试" onclick="getDocAllInfo()" />

    <div id="divDemo">div内容</div>

    <table>

        <tr>

            <td>单元格1</td>

            <td>单元格2</td>

        </tr>

        <tr>

            <td>单元格3</td>

            <td>单元格4</td>

        </tr>

    </table>

    <input type="text" />

    <span>我是SPAN</span>

    

</body>

</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航