怎樣才能在一個無序列表

到子元素的引用我使用無序列表創建一個垂直菜單。在列表中，有些子項目直到點擊事件纔會顯示。我如何獲得一個li元素，從「無」的顯示樣式更改爲「」的第一UL子元素的引用？怎樣才能在一個無序列表

當我點擊mnu03，我怎麼去mnu031參考。現在，我只需在父ID上添加一個「1」來創建孩子的ID，即Kludgy。

我不想使用jQuery。

的標記如下：

<pre> 
<ul> 
    <li><a href="#" id="mnu01" onclick="this">Item 1</a></li> 
    <li><a href="#" id="mnu02" onclick="this">Item 2</a></li> 
    <li><a href="#" id="mnu03" onclick="this">Item 3</a> 
     <ul id="mnu031" style="display:none;" > 
      <li><a href="#" id="mnuSub031" onclick="this">Item S1</a></li> 
      <li><a href="#" id="mnuSub032" onclick="this">Item S2</a></li> 
     </ul> 
    </li> 
    <li><a href="#" id="mnu04" onclick="this">Item 4</a></li> 
    <li><a href="#" id="mnu05" onclick="this">Item 5</a></li> 
</ul> 
</pre>

來源

2013-02-16 Robert Nabolotnyj

這是一個類似的問題，我認爲你的地址在找什麼做：http://stackoverflow.com/questions/10567709/javascript-get-child-element – bygrace 2013-02-16 02:36:40

你試過'nextSibling'？ – ultranaut 2013-02-16 02:38:40

'的document.getElementById（ 'mnu03'）的getElementsByTagName（ 'UL'）[0]'，如果它是'＃mnu03'一個處理器中，只需用'this.getElementsByTagName（ 'UL'）[0]' – adeneo 2013-02-16 02:38:47

在你的JavaScript代碼，你綁定到點擊：

this.parentElement.querySelector('ul').style.display = 'block';

http://jsfiddle.net/CDXH5/

您的HTML一些不匹配的報價，順便說一句。

來源

2013-02-16 02:39:51

將類分配給您的li元素。

window.onload=function() { 
var obj=document.getElementsByClassName('x'); 
for(var i=0;i<obj.length;i++) 
{ 

obj[i].addEventListener("click", function() { 
for(var i=0;i< this.childElementCount ;i++) 
    { 
     // write ur code here this.children[i] is your reference 
    } 

}); 

} 

}

來源

2013-02-16 03:23:18 deepak

使用CSS sibling選擇器只樣式的第一個類。以下僅選擇li下的第一個ul

li > ul {}

還有其他兄弟類型選擇器可能需要嘗試。

的後代選擇
相鄰兄弟組合子
一般兄弟組合子。

的後代選擇： 這造型是一個無序列表下方的任何地方的任何列表項。

ul li{}

相鄰兄弟Combinator的：

p + p { font-size: smaller; } /* Selects all paragraphs that directly follow another paragraph */

子組合子選擇：是嚴格的在您的標記<p>標籤直接孩子選擇標籤。

p > img

不知道這是你在找什麼，但這是我會使用，如果它必須是免費的JS。 css-tricks.com

來源

2013-02-16 03:44:34 BenRacicot

怎樣才能在一個無序列表

回答

相關問題