マウスオーバーでブラウザのステータスバーに表示されるURLを非表示にする方法

Question

前提・実現したいこと

<a href='https://xxx'>リンク名</a>
とリンクさせている場合、マウスオーバーでブラウザのステータスバーに表示されるURLを非表示にする方法で困っています。

該当のソースコード

【方法1 Html5】
<a href="../index.html" onmouseover="window.status=''; return true;" onmouseout="window.status=defaultStatus; return true;">リンク名</a> 

【方法2 JavaScript】
<a href="javascript:void(0);" onclick="OnLinkClick();">リンク名</a>
<script language="javascript" type="text/javascript">
    function OnLinkClick() {
        window.location.href = ''https://xxx';
    }
</script>

方法1でstatusを空白にすれば昔のブラウザなら効果があったはずですが、現在は利かないようです。
方法2では "javascript:void(0)" がステータスバーに代わりに表示されてしまいます。
Html5とcssはある程度分かりますが、JavaScriptはまったく分かりません。
他に良い方法は無いでしょうか？

Comments

[dodox86]

Javaではなく、JavaScriptです。全然違います。

[Hebasan5]

申し訳ないです。JavaScriptと入力している途中でエンターしてしまったようです。

[dodox86]

質問は編集できますのでタグを含めて修正しましょう。そうすることで、JavaScript/HTMLに詳しい方の回答を得やすくなります。雑な印象を受ける質問だと回答も避けられがちになります。

[Hebasan5]

編集できることを知りませんでした。ありがとうございます。

Answer 1

ググった結果、安全面を考えて非表示にすることはできません。
<a href="#">でいいでしょうか？
それか、aタグじゃなく別のタグを使うか。

Answer 2

ちょっとネタ的なコードになってしまいましたが。
サンプルを置いておきます。

https://jsfiddle.net/Lhankor_Mhy/e4grv3nc/

.noStatus{
  pointer-events: none;
}

document.addEventListener('click', ({ pageX, pageY }) => {
    document.querySelectorAll('.noStatus').forEach(e=>e.classList.remove('noStatus'))
    document.elementFromPoint(pageX, pageY).click()
})

Comments

[Hebasan5]

できました！　リンク文字のある場所をマウスオーバーしてもURLは表示されなくなりました。
リンクのあるページで、どこか別の場所をマウスクリックすると表示されるようになりますが、ページを読み込んだ直後はマウスオーバーしても表示されません。
どうもありがとうございました。

[Lhankor_Mhy]

あ、そうでしたね、それを失念していました。
訂正しました。
https://jsfiddle.net/Lhankor_Mhy/e4grv3nc/1/

ただ、他にもいろいろ副作用はあると思うので、やはりネタ的です。

[Hebasan5]

訂正していただきありがとうございます。しかし、前と同じでした。
クラスnoStatusをリンクする文字列だけに適用しているせいなのでしょうか？
しかし、ページを読み込んだ直後はブラウザのステータスバーには表示されませんので、これで目的は達しています。

[Lhankor_Mhy]

本当にこれはネタ的なコードなので、実際に使うのはお勧めできません。
skys215さんのご回答のとおり、a要素ではない別の要素を使うのが一番無難です。

[Hebasan5]

マウスクリックしてリンク先に飛ばすことが主目的ではなく、リンクがあるかどうかがページを見て分からないようにするのが目的なのです。
a 要素以外で、クリックすれば飛ぶようにすることは私でも可能ですが、上記目的には使えないので、これで十分です。ありがとうございました。

[Lhankor_Mhy]

そうだったのですね。
ご解決されて何よりでした。

Answer 3

hrefにはダミーを設定して、ホントのリンク先をdata-hrefのような設定にするとよいかもしれません

<div>parent
<a href="#" data-href="hoge.html" >リンク名<span>test</span></a> 
</div>

<script>
document.addEventListener('click',e=>{
  let n;
  if(n=e.target.closest('a[data-href]')){
    e.preventDefault();
    location.href=n.dataset['href'];
  }
})
</script>

Comments

[Hebasan5]

マウスオーバーすると "***.html#"のようにURLが表示されてしまいます。(***はベースhtml名)
やはりハイパーリンクを非表示にするのは不可能になっているみたいですね。