WEB制作、マーケティングに関する情報をお届けします。ホームページ制作会社、テラのブログ

JavaScriptでブラウザを特定して条件分岐させる方法。

タグ:

制作を行なっているとWindowsやFirefoxなど特定のブラウザで「動かない」や「動くけど動作が重くなる」場合があります。
そういった場合はブラウザを判定し分岐させて対応します。

コード

var ua = window.navigator.userAgent.toLowerCase();
if(ua.indexOf('msie') != -1 || ua.indexOf('trident') != -1 ||) {
    
    //Internet Explorerへの処理
        
} else if(ua.indexOf('edge') != -1) {

    //edgeへの処理

} else if(ua.indexOf('chrome') != -1) {
    
    //Googleクロームへの処理
    
} else if(ua.indexOf('safari') != -1) {
    
    //safariへの処理
    
} else if(ua.indexOf('firefox') != -1) {

    //firefoxへの処理

} else if(ua.indexOf('opera') != -1) {

    //Operaへの処理

} else {
    //上記以外のブラウザへの処理
}

説明

ユーザーのブラウザ情報を取得する
var userAgent = window.navigator.userAgent.toLowerCase();

window.navigator.userAgentでユーザーのブラウザ情報を取得することができます。
.toLowerCase()では取得した文字列を小文字に変換しています。