• 注册
热门标签
↑ 收起导航

javascript实现树状菜单最简单的方法

可以将代码增强,比如加小图标,展开和收缩颜色等等!

代码如下:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>树状菜单的简单实现</title>
<script language="JavaScript" type="text/javascript">
<!--
function toggle(_dt){
 var _dl=_dt.parentNode;
 if(_dl.className=="collapse")_dl.className="expand";
 else _dl.className="collapse";
} 
//-->
</script>
<style type="text/css">
 <!-- 
 dl dt   { cursor:pointer;padding:3px;} 
 dl dd   { padding:3px;} 
 .expand  { height:auto;} 
 .collapse  { height:20px;overflow:hidden;} 
 -->
</style>
</head>
<body>
<dl>
 <dt onclick="toggle(this)">根结点(点我)</dt>
 <dd>子结点1</dd>
 <dd>子结点2</dd>
 <dd>子结点3</dd>
 <dd>子结点4</dd>
</dl>
</body>
</html>
版权声明:转载请注明来自杨俊伟博客,本文地址:http://yangjunwei.com/a/120.html
除非注明,杨俊伟博客文章均为原创,转载请注明出处和链接!
 

发表评论 



我还是想用邮箱注册

登录

忘记密码 ?

用第三方帐号快捷登录

已有账户?前往登录吧~

注册