クリックイベントでMouseかEnterキーかを判定する - Qiita

上記のようにfocus時のスタイルを消してしまえば、いったんは良いのですが、 キーボードでアクセスした時に、そのbuttonがfocusされているのか視覚的に分からないため、アクセシビリティ的には良くありません。 ですので、マウスでクリックした時はfocus時のスタイルを消し、キーボードアクセスでfocusされた時は、スタイルを残せるようにJavaScriptで判定したいと思います。 実装例 const button = document.querySelector('button'); const onClickButton = (event) => { if (event.detail !== 0) { event.currentTarget.style.outline = 'none'; } } const onFocusButton = (event) => { event.cur