Javascriptタグとアンカータグ、ベストプラクティス？

Question

クイック質問。

JavascriptをHREFに入れるか、onClick（イベント）を使用する必要がありますか？

いずれかを使用することについての賛否両論はありますか。個人的に私はfalseを返すか、＃

にジャンプを心配する必要はありません、それは単にHREFにコードを配置する方が簡単/クリーナーだと思うし、それぞれの方法で、任意の既知のブラウザ固有の問題...

例があります：

<a href="javascript: alert('foo!');">Click Me</a> 
<a href="#" onClick="alert('foo!');return false">Click Me</a> 
<a href="javascript:void(0)" onclick="alert('foo!');">Click Me</a> 

Answer 1

1を見てjQueryのチュートリアルの最初の例を参照）。むしろonclickを使用します。 JSが許可されていない場合は、hrefに合理的なフォールバックURLを設定してください。

2）onclick="..."ではなく、イベントハンドラを使用する必要があります。 jQueryまたはXPathを使用して要素を検索し、それぞれに対してelement.addEventListener()を呼び出します。

element.addEventListener("click", function() { alert("bar"); }, false); 

か、古い道...

element.onclick = function() { alert("foo"); }; 

Answer 2

onclickイベント（ただし、属性ではなくJSが割り当てられます）では、分かりやすいhref属性を使用します。 Build on things that work

Answer 3

一般的に、私はJavaScriptを外部化だろうが、それを呼び出すためにhrefを使用します。

<a href="javascript:foo('bar!');">Click Me</a>

私はあなたの迅速なalertの例では、ルールの例外として罰金だと思いますが。

あなたはjQueryのようなJSライブラリを使用している場合しかし、あなたはもちろん、イベントを直接割り当てることができます - アンカー要素http://docs.jquery.com/Tutorials:How_jQuery_Works

Answer 4

HTMLとは別のコードを維持するには、IMOクリーナーです。

<a id="foo" href="#">Click Me</a> 

は、次にヘッドまたは別のjsファイルに：

document.getElementByID("foo").onclick = function() { alert("hi"); } 

Answer 5

私は個人的にHTMLにJavaScriptコードを入れないでしょう。 <a>がクリックされたときにトリガーされるイベントリスナーを使用する必要があります。

<a href="#" id="linkA">Click Me</a> 

そして：

document.getElementById('linkA').addEventListener('click', function(e){ 
    e.preventDefault(); // Prevents page from scrolling to the top 
    alert('foo!'); 
});