[JavaScript]href="javascript"の奇妙な現象

今、iPhoneアプリの申請中ですることが特にないので、google gadgetのメンテナンスを行っているのですが、その中でちょっと不思議なことが起こりました。

aタグのhref属性でjavascriptを走らせるごく単純なプログラムなのですが、書くよりもソースを書いた方が早いかもしれません。

<a href="javascript:change()">test</a> <div id="hoge"></div> <script type="text/javascript"> function change(){ if($("hoge").hasChildNodes()){ $("hoge").innerHTML = ""; return false; } $("hoge").innerHTML = "<ul><li>test</li></ul>"; } </script>

最初、「test」という文字をクリックします。
すると、「bar」という文字が表示されます。
ここまではいいのですが、次に同じように、「test」という文字をクリックすると、「bar」という文字を削除したいのですが、上のプログラムを実行した結果、なんと画面に「false」と表示されたのです。

なぞです？？

で、原因はわからないのですが、これは下記のようにvoid(0)を使うことで回避できるみたいです。

<a href="javascript:void(0)" onclick="change()">test</a> <div id="hoge"></div> <script type="text/javascript"> function change(){ if($("hoge").hasChildNodes()){ $("hoge").innerHTML = ""; return false; } $("hoge").innerHTML = "<ul><li>bar</li></ul>"; } </script>

なんでなんだろう？？