HTML网页如下：(通过嵌套的<ul><li></li></ul>)(兼容IE6-9,谷歌火狐等主流浏览器)
<body onload=”loadFun()”>
<form id=”form1″ runat=”server”>
<div id=”menu”>
<ul>
<li><a href=”#” onclick=”Show(‘rule’)”>相关法规</a>
<ul id=”rule”>
<li><a href=”#”>Adobe Reader</a></li>
<li><a href=”#”>Foxit Reader</a></li>
<li><a href=”#”>操作员计算机IE设置</a></li>
<li><a href=”#”>电子签章办理须知</a></li>
</ul>
</li>
<li><a href=”#” onclick=”Show(‘load’)”>相关下载</a>
<ul id=”load”>
<li><a href=”#”>Adobe Reader</a></li>
<li><a href=”#”>Foxit Reader</a></li>
<li><a href=”#”>操作员计算机IE设置</a></li>
</ul>
</li>
<li><a href=”#” onclick=”Show(‘info’)”>公司简介</a>
<ul id=”info”>
<li><a href=”#”>Adobe Reader</a></li>
<li><a href=”#”>Foxit Reader</a></li>
</ul>
</li>
<li><a href=”#” onclick=”Show(‘window’)”>连接窗口</a>
<ul id=”window”>
<li><a href=”#”>Adobe Reader</a></li>
<li><a href=”#”>Foxit Reader</a></li>
</ul>
</li>
<li><a href=”#” onclick=”Show(‘phone’)”>连接电话</a>
<ul id=”phone”>
<li><a href=”#”>Adobe Reader</a></li>
<li><a href=”#”>Adobe Reader</a></li>
</ul>
</li>
</ul>
</div>
</form>
</body>
网页加载时，需要将所有的菜单项都暂时隐藏，调用相关的JavaScript代码
/*网页加载时触发的函数*/
function loadFun() {
//获取<ul></ul>的所有子节点<li>节点5个
var array = document.getElementsByTagName(“ul”).item(0).childNodes;
//遍历子节点
for (var i = 0; i < array.length; i++) {
//获取<li></li>标签的子节点
var childnodes = array[i].childNodes;
for (var j = 0; j < childnodes.length; j++) {
//如果碰到主菜单中的<ul>标签就隐藏该子菜单的下拉菜单
新闻热点
疑难解答
