用JS控制树结构

在树结构中如何用JS控制点击其中一个节点时其他散开的节点隐藏起来（收缩起来）求方法

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>Test</title>
<style>
.hidden ul{
display: none;
}
</style>
<script src="jquery.js"></script>
</head>
<body>
    <ul>
     <li>
     <span>list 1</span>
     <ul>
     <li>list a</li>
     <li>list b</li>
     <li>list c</li>
     <li>list d</li>
     <li>list e</li>
    </ul>
     </li>
     <li>
     <span>list 2</span>
     <ul>
     <li>list a</li>
     <li>list b</li>
     <li>list c</li>
     <li>list d</li>
     <li>list e</li>
    </ul></li>
     <li>
     <span>list 3</span>
     <ul>
     <li>list a</li>
     <li>list b</li>
     <li>list c</li>
     <li>list d</li>
     <li>list e</li>
    </ul></li>
     <li>
     <span>list 4</span>
     <ul>
     <li>list a</li>
     <li>list b</li>
     <li>list c</li>
     <li>list d</li>
     <li>list e</li>
    </ul></li>
     <li>
     <span>list 5</span>
     <ul>
     <li>list a</li>
     <li>list b</li>
     <li>list c</li>
     <li>list d</li>
     <li>list e</li>
    </ul></li>
    </ul>
    <script>
     $('li').click(function(){
     $(this).siblings().addClass('hidden');
     $(this).removeClass('hidden');
     });
    </script>
</body>
</html>
treeview
就是对子节点的控制。
1.用现成的JS树形控件。作为正式的树形控件，这些方法都有。先调用“收缩全部”函数，再调用打开某个具体节点的函数就可以了。2.如果是自己想写一个JS树形控件，就参照一下现成的控件代码。
一楼可行
1.点击某个节点时，先循环所有节点，并隐藏子树
2.显示点击的节点的子树
        //...引用jquery.js。楼主若不用jquery，自己写JS也可以，参考五楼        $(document).ready(function() {//加载时
            $('ul li').siblings().addClass('hidden');//收缩所有li节点
        });

        $('li').click(function(){//点击某li时
            $(this).siblings().addClass('hidden');//先收缩所有li节点
            $(this).removeClass('hidden');//再展开点击的li节点
        });
附：
jQuery 遍历 - siblings() 方法