javascript clickable text

Question

這應該是一個非常基本的問題。 我想有一些HTML上市：

• 一個
• 乙
• Ç

，並通過點擊的元素之一，東西應該顯示如下。例如，點擊B時的​​，我們得到：

• 一個
• 乙
  「唧唧歪歪」
• Ç

我想有很多方法可以實現這一目標。我只想要最簡單/最乾淨的方式來做到這一點。

謝謝
阿爾諾

Answer 1

<script> 
function open_item(sender) { 
    sender.getElementsByTagName('div')[0].style.display = 'block'; 
} 
</script> 

... 

<ul> 
    <li onclick="open_item(this);"> 
     A 
     <div style="display: none;">bla bla</div> 
    </li> 
    <li onclick="open_item(this);"> 
     B 
     <div style="display: none;">bla bla</div> 
    </li> 
    <li onclick="open_item(this);"> 
     C 
     <div style="display: none;">bla bla</div> 
    </li> 
</ul> 

一個很多，很多，很多的方法來完成相同的。

Answer 2

我會使用jQuery。 爲每個元素提供一個ID，通過jQuery爲每個元素設置一個onClick監聽器，並讓它運行一個查找子元素的功能（如<p>或者你想圍繞你的內容）並顯示它。

Answer 3

下面是一個使用insertAfter一個簡單的jQuery功能

$('li').click(function() { 
    $('<span>blah blah</span>').insertAfter(this); 
}); 

看到它在這裏的行動：http://jsfiddle.net/WwCcF/

Answer 4

您可以添加動態內容使用jQuery：

$("li").click(function() { 
    $(this).append("<br />bla bla bla"); 
}); 

我寫一個純粹的JavaScript代碼...