如何获取当前li上面最近的ul id值

Question

做了一个树形导航 
效果：点开2级菜单则打开当前一级菜单，即显示当前2级菜单同级目录，其他一级菜单默认不打开2级菜单
基本代码：
<DIV id=PARENT>
<UL id=nav>
=========================================
<li><a onClick="new Element.toggle('ChildMenu1')" href="#">1</a>
<ul id=ChildMenu1 style="DISPLAY:none">
<li><a href="/Item/list.asp?id=1228">11</a></li>
<li><a href="/Item/list.asp?id=1228">12</a></li>
<ul><li><a onClick="new Element.toggle('ChildMenu2')" href="#">2</a>
<ul id=ChildMenu2>
<li><a href="/Item/list.asp?id=1280">21</a></li>
<li><a href="/Item/list.asp?id=1281">22</a></li>
</ul></LI><li><a onClick="new Element.toggle('ChildMenu3')" href="#">3</a>
<ul id=ChildMenu3 style="DISPLAY:none">
<li><a href="/Item/list.asp?id=12820">31</a></li>
<li><a href="/Item/list.asp?id=12814">32</a></li>
</ul></LI>
===============================
</UL></DIV>问题：这个<ul id=ChildMenu2> 如何控制style="DISPLAY:none"？？？点击“31”或“12”时候，相应的<ul>如何控制？此外一级目录的li如何控制？我想加些效果。非常感谢~~

Answer 1

先把所有菜单都关上，再把想要的打开。PS：楼主用jquery的不

Answer 2

就是获取当前节点的父节点的问题  更改当前第一个<ul>的css
我用了如下代码：
<script type="text/javascript" language="javascript">
var nav = document.getElementById("navleft"); 
var links = nav.getElementsByTagName("li"); 
var lilen = nav.getElementsByTagName("a"); 
var currenturl = document.location.href; 
var last = 0; for (var i=0;i<links.length;i++) {     
var linkurl = lilen[i].getAttribute("href");         
if(currenturl.indexOf(linkurl)!=-1)             {            
last = i;             
} 
} 
links[last].className = "current2";
</script> 
links[last].parentNode.innerHTML 不是获取了父节点的数据么 怎么获取了整个同级目录的数据？ 

Answer 3

var tt=links[last].parentNode.parentNode;  得到了<a onClick="new Element.toggle('ChildMenu3')" href="#">3</a>
<ul id=ChildMenu3 style="DISPLAY:none">
<li><a href="/Item/list.asp?id=12820">31</a></li>
<li><a href="/Item/list.asp?id=12814">32</a></li>
</ul>怎么改变那个style="DISPLAY:none" 呢

Answer 4

这个可以参考不
http://topic.csdn.net/u/20111107/17/90366922-7642-40aa-93b5-6c165784e84c.html

Answer 5

tt.style.display = "block";

Answer 6

var tt=links[last].parentNode;
tt.style.display='block';谢谢大家 解决了第一步 style的问题上面解决了
<li><a onClick="new Element.toggle('ChildMenu2')" href="#">菜单二</a>
<ul id=ChildMenu2>
<li><a href="/Item/list.asp?id=1280">21</a></li>
<li><a href="/Item/list.asp?id=1281">22</a></li>
</ul></LI>我还需要对“菜单二”进行一些样式操作 请问怎么定位啊？
菜单二 改变一下颜色，加个背景。第一个<li>那里加个class也行。

Answer 7

最好是替换为<font color=#FFF>菜单二</font> 这样就可以了

Answer 8

tt.parentNode.childNodes[0].style.color='white';