[解決済み] Valid to use <a> (anchor tag) without href attribute?

Question

I've been using Twitter Bootstrap to build a site, and a lot of its functionality depends on wrapping things in <a> , even if they're just going to execute Javascript. I've had problems with the href="#" tactic that Bootstrap's documentation recommends, so I was trying to find a different solution.

But then I tried just removing the href attribute altogether. I've been using <a class='bunch of classes' data-whatever='data'> , and having Javascript handle the rest. And it works.

Yet something's telling me I shouldn't be doing this. Right? I mean, technically <a> is supposed to be a link to something, but I'm not entirely sure なぜ これが問題なのです。それとも、そうなのでしょうか？

解決方法は？

その <a> nchor 要素は、あるコンテンツへの、またはあるコンテンツからの、単純なアンカーです。元々 HTML 仕様では、名前付きアンカー ( <a name="foo"> ) とリンクアンカー ( <a href="#foo"> ).

名前付きアンカー形式はあまり使われなくなり、現在ではフラグメント識別子を用いて [id] 属性を指定することができます（ただし、後方互換性を保つために [name] 属性を使用します)。 An <a> 要素で [href] 属性はまだ有効です .

セマンティクスとスタイリングに関する限りは <a> 要素はリンクではありません ( :link を持たない限りは [href] 属性があります。この副次的な効果として <a> 要素で [href] は、デフォルトではタブ順序になりません。

本当の問題は <a> 要素だけでは、適切な表現として <button> . 意味的なレベルでは、以下のような明確な違いがあります。 link と button .

ボタンとは、クリックすると動作が発生するものです。

リンクは、現在のドキュメント内のナビゲーションを変更させるボタンです。発生するナビゲーションは、フラグメント識別子( #foo )、URLの場合は新しいドキュメントに移動する( /bar ).

リンクは特殊なタイプのボタンであるため、しばしばそのアクションを上書きして別の機能を実行させてきました。アンカーをボタンとして使い続けることは、意味的には正確ではありませんが、一貫性の観点からは問題ありません。

を使用した場合のセマンティクスやアクセシビリティが気になる場合は、以下のようになります。 <a> 要素（または <span> または <div> ) をボタンとして使用する場合は、以下の属性を追加する必要があります。

<a role="button" tabindex="0" ...>...</a>

は ボタンの役割 は、特定の要素がボタンとして扱われることをユーザーに伝え、基になる要素が持っていたどんなセマンティックスの上書きになるかを示します。

について <span> と <div> 要素に、JavaScript のキーリスナーを追加したい場合があります。 スペース または 入力 をトリガーに click イベントが発生します。 <a href> と <button> 要素はデフォルトでそうなっていますが、ボタン以外の要素はそうなっていません。時には click トリガーを別のキーに設定します。例えば、Webアプリケーションの "help" "ボタンは、次のようにバインドされます。 F1 .