javascript void(0) とは

javascript void(0) は a タグの href 属性値としてよく使われますが、これは何を意味しているのでしょうか。ここでは、JavaScript における void 演算子の意味と、典型的な使用例として a タグと onclick を組み合わせて使う例を説明します。

a タグと onclick を合わせて使う

JavaScript では、ブラウザ上の HTML 要素に対してクリックなどのイベントが発生した際に何らかの動作を行う場合があります。その際、a タグは要素（<a></a>で囲まれた部分）にマウスカーソルを合わせることでクリック可能なことが一目でわかるため、イベントハンドラである onclick などと組み合わせて明示的にクリックを促す際によく使われます。

しかし、aタグは要素をクリックすると href 属性に指定した URL に画面遷移してしまいます。このような働きを防ぐために、javascript void(0)  がよく使われます。ただ a タグを使った場合、ステータスバーにアクセス先の URL 先として javascript:void(0) と表示されてしまいます。そのため実装する場合は、 a タグではなく button などの適切なタグを使用して CSS でスタイルを記述したほうがいいでしょう。

javascript void(0) を使って a タグの画面遷移を無効化する

次の例では、クリックすると別ウィンドウで window.open() の引数として指定したURLを開きますが、元のページは遷移せずにそのままです。

a タグは、href 属性に指定した値をURLとして解釈し、画面遷移をしようとします。href="" のように空文字を指定しても、元のページは再読み込みされてしまいます。また、# を指定しても、元のページはページの最上部に移動してしまいます。

javascript void(0) を使うと画面遷移が起きない仕組み

上の例では元のページには画面遷移などの変化を起こさせたくないため、href 属性に javascript void(0) を指定することで a タグの働きを無効化しています。これは以下のような仕組みのためです。

・void 演算子は式を評価し、評価した結果必ず undefind 値を返します。

・a タグは、href 属性の値に undefind 値を指定した場合には何も動作しません。

void(0) は、結果が必ず undefined 値であるという意味では、void(123)、void("abc") あるいは、void(null) でも構いませんが、慣習的に void(0) が使われています。

また、a タグの href 属性が undefined値 なら、直接 href="javascript:undefined" としても問題なさそうですが、以前は undefinedはグローバル変数であり、書き換え可能であったため、今でも古いブラウザに対応するという点で void(0) が最もよく使われています。

javascript void(0) のリンクが開かない場合

JavaScript を利用しているので、単純な HTML を利用したリンクではないため、 IE、FireFox、Google Chrome などのバージョンが古い場合や、ブラウザの設定しだいではページが開かない場合があります。その場合は、ブラウザをアップデートしたり、JavaScript を有効にしたりすることで直る可能性があります。

また、JavaScript 自体の記述が間違っている場合も正常に動作が行われないので、記述が間違っていないかも確認してみてください。