javascript:; ってなんですか？


下記のようにウェブページのリンク先がときどき`javascript:;`になっていてリンク先のファイルやページに飛べないことがあります。

この`javascript:;`はそもそもどのような処理をして、サイト制作者はなんのためにこのようなリンクを作成するのでしょうか？

[code]

    <a href="javascript:;" rel="nofollow">example.pdf</a>
[/code]




`javascript:`
で始まるURLに移動しようとすると、後続のJavascriptコードが実行されます。が、今回の場合Javascriptコードは空っぽなので、何もしません。

リンクをクリックしたときにJavascriptを実行するようにしたい場合、最近ではJavascript側からイベントハンドラを登録することが多いですが、この場合href属性はなくても動きますよね。しかし、aタグは元々リンク専用のタグでないこともあり、
**ハイパーリンクの記法としてはhref属性が必要です** 。実際、href属性がないとリンクらしい見た目にはなりません。

[code]

    document.getElementById('link').addEventListener('click', function(){ alert('clicked!') });
[/code]

[code]

    <a id="link">Click me!</a>
[/code]

かといって適当な値を指定してはリンクとして機能してしまいます。`<a href="">`
と空文字列を指定しても、（クエリ文字列もURLフラグメントも指定されていない）同じページへのリンクになってしまいます。

そこで **何もしないリンク先** として、何もしないJavascriptを指定するのです。他にも例えば：

  * `<a href="javascript:return false;">`
  * `<a href="javascript:void(0)">`

なお、イベントハンドラで `event.preventDefault()`
を呼び出すことで、「hrefに指定されたURLに遷移する」というデフォルトの挙動を抑制することができます。この場合はhrefに何を指定しても構いません。

参考： [a 要素 - HTML |
MDN](https://developer.mozilla.org/ja/docs/Web/HTML/Element/a)




`javascript:`
で始まるURLに移動しようとすると、後続のJavascriptコードが実行されます。が、今回の場合Javascriptコードは空っぽなので、何もしません。

リンクをクリックしたときにJavascriptを実行するようにしたい場合、最近ではJavascript側からイベントハンドラを登録することが多いですが、この場合href属性はなくても動きますよね。しかし、aタグは元々リンク専用のタグでないこともあり、
**ハイパーリンクの記法としてはhref属性が必要です** 。実際、href属性がないとリンクらしい見た目にはなりません。

[code]

    document.getElementById('link').addEventListener('click', function(){ alert('clicked!') });
[/code]

[code]

    <a id="link">Click me!</a>
[/code]

かといって適当な値を指定してはリンクとして機能してしまいます。`<a href="">`
と空文字列を指定しても、（クエリ文字列もURLフラグメントも指定されていない）同じページへのリンクになってしまいます。

そこで **何もしないリンク先** として、何もしないJavascriptを指定するのです。他にも例えば：

  * `<a href="javascript:return false;">`
  * `<a href="javascript:void(0)">`

なお、イベントハンドラで `event.preventDefault()`
を呼び出すことで、「hrefに指定されたURLに遷移する」というデフォルトの挙動を抑制することができます。この場合はhrefに何を指定しても構いません。

参考： [a 要素 - HTML |
MDN](https://developer.mozilla.org/ja/docs/Web/HTML/Element/a)

