简单的树形列表(无限级次可折叠)

最新推荐文章于 2021-10-29 09:12:30 发布

predict

最新推荐文章于 2021-10-29 09:12:30 发布

阅读量1k

点赞数 1

分类专栏：网页设计文章标签： function stylesheet tree class 产品 html

本文链接：https://blog.csdn.net/predict/article/details/6798914

版权

这个博客展示了如何使用HTML、CSS和JavaScript实现一个无限级的树形列表，列表具有可折叠的功能。通过点击列表项，可以展开或收起其子级节点。博客中包含示例代码和解释。

摘要由CSDN通过智能技术生成

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"   "http://www.w3.org/TR/html4/loose.dtd">  
    <html>  
    <head>  
     
      <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

<meta http-equiv="Content-Type" content="text/html; charset=GB2312" />

<link rel="stylesheet" type="text/css" href="/css/div.css" />
<link rel="stylesheet" type="text/css" href="/css/table.css" />
 <script type="text/javascript" src="/js/jquery.js"></script>
 
<link rel="stylesheet" type="text/css" href="/css/treeview.css" />
 
<script type="text/javascript">

$(document).ready(function(){

$(".tree").click(function (){
	 
	 
	 
    if($(this).attr("TreeOpen")=="true")
	{
	    var Child= new Array();
	    Child[0]=0;
		CloseTree($(this),Child);
		 //收缩移动数据项
	    var top=$(this).css("top").replace("px",'')-0;
		 
		 $("#treeView").children().each(function(){
	        var isChild=false;
	        for(var i=1;i<Child.length;i++)
	        {
	            if(Child[i]==$(this).attr("id"))
	            {
	                isChild=tr