フロントエンド開発中にブラウザのバージョンを確認する 2 つの方法_JavaScript スキル

インターネット上でブラウザとバージョンを見つける方法はたくさんありますが、ここではみんなの時間を節約するためにそれらをまとめます。

1.jquery メソッド:

一般的なブラウザとそのバージョンは、正規表現を使用して判断できます。

コードをコピー コードは次のとおりです:

function allinfo(){

var ua = navigator.userAgent;
ua = ua.toLowerCase();
var match = /(webkit)[ /]([w .] ) /.exec(ua) ||
/(opera)(?:.*version)?[ /]([w.] )/.exec(ua) ||
/(msie) ([w .] )/.exec(ua) ||
!/compatibility/.test(ua) && /(mozilla)(?:.*? rv:([w.] ))?/.exec (ua) || [];

//ブラウザのバージョン番号を取得する必要がある場合: match[2]

switch(match[1]){
case " ": //ie
if (parseInt(match[2]) === 6){ //ie6
alert("ie6");
alert("IE7.0 以前のブラウザはサポートされていません現在サポートされているため、ブラウザのバージョンをアップグレードしてください。 ");
//document.getElementById("hid").style.display = "none";
// document.getElementById("show").style。 display = "ブロック";
//document.getElementById("nosee_b").style.display = "none";
}
else if (parseInt(match[2]) === 7) { / /ie7
alert("ie7");
//document.getElementById("hid").style.display = "none";
// document.getElementById("show"); style.display = "ブロック";
else if (parseInt(match[2]) === 8){ //ie8
alert("ie8"); >else if(parseInt(match[2]) === 9){
alert("ie9");
//document.getElementById("hid").style.display = "none"; 🎜> }
break;
case "webkit": //safari または chrome
//alert("safari または chrome")
// document.getElementById("middle"); .display = "none";
break;
case "opera": //opera
alert("opera");
case "mozilla": //Firefox 🎜>alert("Firefox");
//document.getElementById("hid").style.display = "none";
デフォルト:
break;
}


「===」がここで使用されており、「==」と「=」との関係がわかります

=これはさらに言うと、開発中にパラメータには値が割り当てられます。

== 平等、=== 同一性。
==、両側の値の型が異なる場合は、まず型変換を実行してから比較する必要があります。
===、型変換は実行されず、異なる型は等価であってはなりません。

例:
2 つの値の型が異なる場合、それらは等しい可能性があります。型変換を実行し、次のルールに従って比較します:
a. 一方が null で、他方が未定義の場合、[等しい]。
b. 一方が文字列で、もう一方が数値の場合、文字列を数値に変換して比較します。
c. いずれかの値が true の場合は 1 に変換して比較し、いずれかの値が false の場合は 0 に変換して比較します。
d. 一方がオブジェクトで、もう一方が数値または文字列の場合、オブジェクトを基本型の値に変換して比較します。オブジェクトは、toString メソッドまたは valueOf メソッドを使用して基本型に変換されます。 JS コアの組み込みクラスは toString の前に valueOf を試行しますが、toString 変換を使用する Date は例外です。


2. HTML のコメントメソッド


(1) HTML のコメントメソッド
現在の IE ブラウザのバージョンを検出するには、次のコードを使用できます (注: この効果は IE 以外のブラウザでは表示されません)、この方法は IE5 以降で使用されます。
HTML のコメント形式は です。IE は条件式をサポートできるように HTML コメントにいくつかの拡張を加えました:
式が True の場合、HTML コンテンツが表示されます。
[if IE] IE かどうかを判断します。 [if !IE] IE ではないかを判断します。 [if lt IE 5.5] IE5.5 より前のバージョンかどうかを判断します。 (<)
[if lte IE 6] IE6 のバージョン以下かどうかを判定 (<=)
[if gt IE 5] IE5 以降のバージョンかどうかを判定 (> )
[if gte IE 7] IE7 以降のバージョンかどうかを判断します
[if !(IE 7)] IE7 ではないかどうかを判断します
[if (gt IE 5)&(lt IE 7)] かどうかを判断しますIE5 より大きく、IE7 より小さい
[if (IE 6)|(IE 7)] IE6 か IE7 かを判断します

lte: Less than orequal to、の略です。これは以下を意味します。 lt: Less thanの略で、未満という意味です。 gte：Greater than orequal toの略で、以上という意味です。 gt：Greater thanの略で、「より大きい」という意味です。 !: 等しくないという意味で、JavaScript の不等号判定記号と同じです
例:




コードをコピー


コードは次のとおりです:

(2) 条件付きコメントの適用方法

IE ブラウザのさまざまなバージョンは、作成した WEB 標準ページを解釈しないため、同じです、具体的には CSS の解釈が異なります。これらと互換性を持たせるには、条件付きコメントを使用して個別に定義することで、最終的に互換性の目的を達成できます。

例: < !–- デフォルトでは、css.css スタイル シートが最初に呼び出されます–->

< !-–[IE 7 の場合]>





>
これは、IE7 と IE6 の下位ブラウザによる CSS の実行を区別します。互換性を実現するために。同時に、最初の行のデフォルトの css.css は、他の非 IE ブラウザーとも互換性があります。

注: デフォルトの CSS スタイルは HTML ドキュメントの最初の行に配置する必要があり、条件付きコメント判定のすべてのコンテンツはデフォルト スタイルの後に配置する必要があります。 たとえば、次のコードは IE ブラウザで実行すると赤色で表示されますが、IE 以外のブラウザでは黒色で表示されます。条件コメント判定が1行目にある場合は実装できません。この質問例は、Web ページ上の IE ブラウザと非 IE ブラウザ間の互換性の問題を解決する方法を説明するのに非常に役立ちます。