href式<a href=“javascript:;”> </a>は何をしますか？

私は時々ウェブページで次のhrefが使用されるのを見ました。しかし、これが何をしようとしているのか、そのテクニックはわかりません。誰かが詳しく教えてもらえますか？

<a href="javascript:;"></a>

<a>それはどちらか持っていない限り、要素が無効なHTMLであるhrefかnameの属性を。

リンクとして正しくレンダリングする場合（つまり、下線、ハンドポインターなど）、href属性がある場合にのみレンダリングします。

したがって、このようなコードはリンクを作成する方法として使用されることがありますが、href属性に実際のURLを指定する必要はありません。開発者は明らかにリンク自体が何もしないことを望んでおり、これは彼が知っていた最も簡単な方法でした。

彼はおそらくリンクがクリックされたときにトリガーされるjavascriptイベントコードを別の場所に持っています。そしてそれが実際に起こりたいことですが、通常の<a>タグリンクのように見せたいです。

一部の開発者href='#'は同じ目的で使用しますが、これによりブラウザーがページの上部にジャンプするため、望ましくない場合があります。またhref=''、現在のページへのリンクであるため、hrefを空白のままにすることはできません（つまり、ページを更新します）。

これらのものを回避する方法があります。空のJavascriptコードをで使用するhrefこともその1つであり、最善の解決策ではありませんが、機能します。

基本的にリンクを使用してページ（またはアンカー）を移動する代わりに、このメソッドを使用してJavaScript関数を起動します

<script>
function doSomething() {
  alert("hello")
}
</script>
<a href="javascript:doSomething();">click me</a>

リンクをクリックすると、アラートが発生します。

リンクが宛先に到達するのを回避するメカニズムはいくつかあります。質問からのものはあまり直感的ではありません。

クリーナーのオプションが使用され、文書内の非定義されたアンカーです。href="#no"#no

#disableや#actionなどのよりセマンティックな名前を使用して、読みやすくすることができます。

アプローチの利点：

• 空のhref = "＃"の「最上部に移動」効果を回避します
• JavaScriptの使用を避けます

欠点：

• アンカー名がドキュメントで使用されていないことを確認する必要があります。

<a>要素はリンクとして機能しないので、これらの場合の最良のオプションは、<a>要素ではなくa <div>を使用して、希望のリンクのようなスタイルを提供することです。

<a href="javascript:alert('Hello');"></a>

以下の略記です：

<a href="" onclick="alert('Hello'); return false;"></a>

これは、リンクをクリックしても絶対に何もしないようにする方法です（Javascriptイベントがリンクされていない場合）。

リンクをたどるのではなく、JavaScriptを実行する方法です。

<a href="Javascript: doStuff();">link</a>

実際に実行するJavaScriptがない場合（例のように）、何も実行されません。

これを参照してください：

<a href="Http://WWW.stackoverflow.com">Link to the website opened in different tab</a>
<a href="#MyDive">Link to the div in the page(look at the chaneged url)</a>
<a href="javascript:;">Nothing happens if there is no javaScript to render</a>

<a href="javascript:void(0);"></a>

javascript: ブラウザにJavaScriptコードを書き込むよう指示します

古いスレッドですが、開発者がこの構造を使用する理由はデッドリンクを作成するためではなく、何らかの理由でJavaScript URLがアクティブなHTML要素への参照を正しく渡さないためです。

例handler_function(this.id)として働くonClick、JavaScript URLとしてはが、機能しません。

したがって、これは、各ハイパーリンクの呼び出しを手動で調整する必要がある、標準に準拠したコードを作成するか、一度作成してどこでも使用できるわずかに非標準的なコードを作成するかのどちらかです。

だからそれはのhrefようなイベントリスナーの代わりに内部にjsコードを書くために使用されonclick、#リンクhrefを作成するのを避けますaタグをhtmlに対して有効にするために使用されていました。

属性javascript:内での使用方法について調査しましたhref。

<a href="
     javascript:
        a = 4;
        console.log(a++); 
        a += 2; 
        console.log(a++); 
        if(a < 6){ 
            console.log('a is lower than 6');
        } 
        else 
            console.log('a is greater than 6');
        function log(s){
            console.log(s);
        }
        log('function inplimentation working too');

">Click here</a>

このコードを使用すると、関数を呼び出すだけでなく、jsコードをそこに書き込むこともできます。

Chromeバージョン68.0.3440.106（公式ビルド）（64ビット）でテスト済み

Firefox Quantom 61.0.1（64ビット）でテスト済み

リンクを常に適切にレンダリングする最良の方法は、次のようにcssを使用することです。

a {cursor: pointer !important}

スレッドで言及されているような不要なことは避けてください。