jQuery案例四简单的树形菜单
上一节
下一节
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>17.4简单树形菜单</title>
<script src="js/jquery-3.1.1.min.js"></script>
<script>
$(function(){
$('#menu>li>h3').click(function(){
$(this).next().toggle();
});
});
</script>
<style>
#menu>li>ul{
display:none;
}
</style>
</head>
<body>
<ul id="menu">
<li>
<h3>文件</h3>
<ul>
<li>新建</li>
<li>保存</li>
<li>打开</li>
</ul>
</li>
<li>
<h3>编辑</h3>
<ul>
<li>复制</li>
<li>粘贴</li>
<li>全选</li>
</ul>
</li>
<li>
<h3>查看</h3>
<ul>
<li>设计</li>
<li>代码</li>
<li>工具栏</li>
</ul>
</li>
</ul>
</body>
</html>
单击文件
