JavaScript の userAgent 属性を使用してブラウザの種類を判断する方法

不言
リリース: 2019-01-12 14:01:46
オリジナル
3894 人が閲覧しました

ブラウザの種類を判断するには、JavaScript で提供されている Navigator オブジェクトの userAgent 属性を使用します。これは、JavaScript を実行しているブラウザの種類やバージョンなどの情報を取得できる唯一の属性です。を使用しますが、ブラウジングを間違えるとプロセッサの順序の判断を間違いやすいので注意が必要です。

JavaScript の userAgent 属性を使用してブラウザの種類を判断する方法

まずuserAgent 属性の基本的な構文を見てみましょう

window.navigator.userAgent;
ログイン後にコピー

このようにして、「ブラウザ情報を記述した文字列「文字列」を戻り値として返します。

ポイントは最後まで情報を文字列として取得することです!

そのため、indexOf()などのメソッドを利用して、文字情報の中からブラウザの種類とバージョンを抽出する必要があります。

ブラウザ情報を取得するにはどうすればよいですか?

実際にブラウザの種類を取得するプログラムを作成してみましょう。

まず、userAgent 属性からブラウザ情報を取得します。

//方法① var agent = window.navigator.userAgent; //方法② var agent = window.navigator.userAgent.toLowerCase();
ログイン後にコピー

方法①通常通りuserAgent属性を使用しますが、②最後にtoLowerCase()を実行します。

実際には、取得されるブラウザ情報は大文字と小文字が混在する文字列なので、基本的にすべて小文字か大文字かの方が判断しやすいです。

ということで、大まかに言うと②の方法で書いていきます!

var agent = window.navigator.userAgent.toLowerCase(); var result = agent.indexOf('chrome') > -1; console.log(result);
ログイン後にコピー

この例では、indexOf()を利用してブラウザ情報から取得したテキスト「chrome」が存在するかどうかを確認しています。

そうでない場合は「-1」を返し、存在する場合は「文字位置」を返します。

したがって、「> -1」の比較により、「真/偽」が得られるので、判定することができます。

ブラウザ判定

現在主流のブラウザとして「IE」「Chrome」「Safari」「Firefox」など様々なブラウザがあります

各ブラウザがどのように判断されるかを見てみましょう。

一般的に各ブラウザ名は基本的にIF文により順番に判定されます。

var agent = window.navigator.userAgent.toLowerCase(); if(agent.indexOf('msie') > -1) { console.log('IE浏览器'); } else if(agent.indexOf('edge') > -1) { console.log('Edge浏览器'); } else if(agent.indexOf('chrome') > -1) { console.log('Chrome浏览器'); } else if(agent.indexOf('safari') > -1) { console.log('Safari浏览器'); } else if(agent.indexOf('firefox') > -1) { console.log('Firefox浏览器'); } else { console.log('其他浏览器'); }
ログイン後にコピー

この例では、userAgent を使用してブラウザ情報を取得し、indexOf() で各ブラウザ名を順番に決定します。

冒頭でも少し紹介しましたが、比較する順番はとても重要です!

実際、userAgent 属性を使用して Edge ブラウザを検査すると、「chrome」と「safari」という文字が含まれています。

また、Chrome に「safari」という単語が含まれていることを確認してください。

このように、本来のブラウザとは異なる名称が含まれる場合もあるため、まずは調査対象のブラウザを比較する必要があります。

基本的には「Edge」→「Chrome」→「Safari」の順番だけは確保しましょう!

以上がJavaScript の userAgent 属性を使用してブラウザの種類を判断する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート
私たちについて 免責事項 Sitemap
PHP中国語ウェブサイト:福祉オンライン PHP トレーニング,PHP 学習者の迅速な成長を支援します!