button要素をボタンっぽくないようにする
JavaScriptで、状態を遷移させないアンカーを生成しつつ、クリックイベントを処理するのに、<a href="javascript:void(0)" onclick="...">
とする方法がありました。
でもこれ、ステータスバーに出る遷移先URIが"javascript:void(0)"と出てしまうので、良くないんですって(何年前の話をしているかは聞かないで下さい)。
じゃあ<a>
はやめよう、と。でも<span>
にonlickを付けるのは気乗りしない。<span>
はインラインのコンテナという意味しか持ちません。要素の意味を無視するのは好きではないです。
button要素に付けよう、と。
ていうか、アプリケーションの大体においては、<a>
より<button>
の方がふさわしいのではないかと。
で、<button>
っぽくない表示にするスタイルを検討した結果を次に示します。
{ background: none; border: 0; padding: inherit; text-align: inherit; cursor: pointer; font: inherit; box-sizing: inherit; }