🛠JavaScriptでブラウザが疑似要素・疑似クラス・メディアクエリ特性・プロパティに対応しているか判定する｜たかもそ／Web Creator.

ブラウザが特定のCSSに対応しているかどうかをJavaScriptで判定する方法です。最近ではCSSの@supportsクエリが実装されているのであまり使うことはないかもしれませんが、CSSの対応状況を調べたいときなどに使えます。 疑似要素と疑似クラスの判定document.querySelector()関数に疑似要素や疑似クラスを指定すると、ブラウザが対応していない場合にエラーとなります。そこで、try-catch文を使い、エラーの際は非対応と判定しています。document.querySelector()関数に対応していない場合はnullを返します。 const support = pseudo => { try { if (!document.querySelector) return null document.querySelector(pseudo) } catch { ret