エクスプローラみたいに、項目をクリックしたらそれに紐づけられている項目

質問

エクスプローラみたいに、項目をクリックしたらそれに紐づけられている項目が表示されるようにしたい。

お世話になります。
HTMLについて教えてください。

現在下記のような項目を考えています。
-------------------------
・目次
・第１章
　　１節
　　２節
・第２章
----------------------------

しかしながら、いつも第１章に紐づけられている１節２節を
表示するのではなく
-------------------------
・目次
・第１章
・第２章
----------------------------
の状態で第１章をクリックすると
-------------------------
・目次
・第１章
　　１節
　　２節
・第２章
----------------------------
のように１節・２節が表示されるようにしたいのです。

お手数ですがよろしくお願いします。

回答No.1

zeff · ベストアンサー

http://www.sasaraan.net/program/js/jsmenu2.html
ここの「// Node_Click関数 」のところをご覧ください。

html部：
<ul>
<li><span onclick="Node_Click('p1')">第1章</span>
<ul id="p1" style="display:none;">
<li>1節</li>
<li>2節</li>
</ul>
</li>
<li>第2章</li>
</ul>

javascript部：
<script type="text/javascript">
<!--
function Node_Click(idChild)
{
if (!document.getElementById) return;
var child = document.getElementById(idChild);
if (child.style.display == "none") {
child.style.display = "block";
} else {
child.style.display = "none";
}
}
//-->
</script>

ちなみに
"block";のところを""と何もなしにすると、
ブロックレベル要素でもインライン要素でもどちらでも使えます。