用dl dt dd创建一个目录树如何加载时就隐藏呢
用dl dt dd创建一个目录树怎么加载时就隐藏呢
<html>
<head>
<title> New Document </title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
dl { background-color:#000;color:#fff;width:100px;}
dt { cursor:pointer;width:100%;background-color:#666;}
.expand {overflow:visible;}
.collapse {height:16px;overflow:hidden;}
</style>
<script>
function toggleDl(dt){
var dl=dt.parentNode;
if("collapse"==dl.className)
dl.className="expand";
else
dl.className="collapse";
}
</script>
</head>
<body>
<dl>
<dt onclick="toggleDl(this)"><a href="">web</a></dt>
<dd>html</dd>
<dd>css</dd>
<dd>js</dd>
<dd>ajax</dd>
</dl>
</body>
</html>
------解决思路----------------------
</head>
<body>
<dl class="collapse">
<dt onclick="toggleDl(this)"><a href="">web</a></dt>
<dd>html</dd>
<dd>css</dd>
<dd>js</dd>
<dd>ajax</dd>
</dl>
</body>
</html>
<html>
<head>
<title> New Document </title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
dl { background-color:#000;color:#fff;width:100px;}
dt { cursor:pointer;width:100%;background-color:#666;}
.expand {overflow:visible;}
.collapse {height:16px;overflow:hidden;}
</style>
<script>
function toggleDl(dt){
var dl=dt.parentNode;
if("collapse"==dl.className)
dl.className="expand";
else
dl.className="collapse";
}
</script>
</head>
<body>
<dl>
<dt onclick="toggleDl(this)"><a href="">web</a></dt>
<dd>html</dd>
<dd>css</dd>
<dd>js</dd>
<dd>ajax</dd>
</dl>
</body>
</html>
------解决思路----------------------
</head>
<body>
<dl class="collapse">
<dt onclick="toggleDl(this)"><a href="">web</a></dt>
<dd>html</dd>
<dd>css</dd>
<dd>js</dd>
<dd>ajax</dd>
</dl>
</body>
</html>