V.S.A. III

こんにちは，五十嵐です．メニューを fold させるのに HTML と javascript が分離できないものかと悩んでいます．

こんなことをしたいわけです．（ボタンを押してみてください)

• リスト1
• リスト2
• リスト3

という具合．上の例では，

<button onclick="foldtoggle('ul1',this)">+</button>

という風に，HTML の中に "onclick" で javascript の関数を呼び出しているのですが，HTML と CSS のようにできるだけ分離したいと考えています．もちろん，Firefox でも IE6/7 でも動くようなクロスブラウザ環境で．

もう一つのやり方は，<span> などで空の部分を書いておいて，後で javascript で展開する部分を指定しておく方法．

• リスト1
• リスト2
• リスト3

<span id="foldplace"></span>
<ul id="ul2">
<li>リスト1</li>
<li>リスト2</li>
<li>リスト3</li>
</ul>
<script type="text/javascript">
<!-- 
getEById( "ul2" ).style.display="none";
getEById( "faldplace" ).innerHTML=
  "<button onclick=\"foldtoggle('ul2',this)\">+</button> リストの折りたたみ<br />";
// -->
</script>

確かに，分離はできているのですが，これもなんだか美しくない感じで．．．javascript が off になっている場合でも見えるようにするためには，後者なのかなぁ．．．

何か，いいアイディアはないでしょうか．