JavaScriptはブラウザがIEかどうかを判定します

JavaScriptはブラウザがIEかどうかを判定します

フロントエンド開発者としては、IEの落とし穴は避けて通れません。他のブラウザはいいのにIEは壊れている。いろいろサポートされていない。と確信しています。

一部のプロパティとメソッドはすべてのバージョンの IE でサポートされていませんが、一部は部分的にサポートされています。プロジェクトでは、主な境界線は IE8 です。現在保守および開発中のプロジェクトのほとんどは IE8 以上をサポートしていると思います。そこで、この記事では、ブラウザーが IE であり、そのバージョンが 8.0 であるかどうかを判断する方法を簡単にまとめます。

まず、一部のプロパティとメソッドはIEのすべてのバージョンでサポートされていないため、IEであるかどうかを判断するだけで済みます。

以下の3つは私がプロジェクトで使用した方法です。新しい方法があれば更新します。他にもっと良い方法があれば、ぜひ共有してください~~

  • ドキュメント.すべて
  • ウィンドウ.ActiveXオブジェクト
  • ウィンドウ.ナビゲーター.msSaveOrOpenBlob
//関数を1つ選択する isIE(){
 // Firefox は将来 document.all メソッドを追加すると言われているので、他の 2 つのメソッドを使用することをお勧めします。if (document.all) return true; 
 
 if (!!window.ActiveXObject || "ActiveXObject" in window) return true; 
 
 if (window.navigator && window.navigator.msSaveOrOpenBlob) が true を返します。 
}

ブラウザがIE8以下であるかどうかを確認する

上で述べたように、メンテナンスおよび開発中のプロジェクトのほとんどは IE8 以降のみをサポートしています。

ナビゲーター.userAgent

関数isIE8(){
 var DEFAULT_VERSION = 8.0; 
 var ua = navigator.userAgent.toLowerCase(); 
 var isIE = ua.indexOf("msie")>-1; 
 var safariバージョン; 
 if(isIE){ 
  safariVersion = ua.match(/msie ([\d.]+)/)[1]; 
 } 
 safariバージョン<=DEFAULT_VERSIONの場合{ 
  真を返す 
 };
}

特別な要件があり、下位バージョンとの互換性が必要な場合は、次の手順に従ってください。

var isIE = !!window.ActiveXObject; 

var isIE6 = isIE && !window.XMLHttpRequest; 

var isIE8 = isIE && !!document.documentMode; 

var isIE7 = isIE && !isIE6 && !isIE8;

CSS プロパティは IE8 以下ではサポートされていません

  • ボックスシャドウ
  • 線形グラデーション
  • プロンプトプレースホルダー
  • 透明度 RGBA
  • 境界線画像
  • 境界線の半径
  • 回転関連の変換

IEでサポートされていないメソッド

PDF ファイルをオンラインで参照します。IE には PDF リーダーが組み込まれていないため、ダウンロードして表示することしかできません。

  • バックエンドがファイル ストリームを返す場合: window.navigator.msSaveOrOpenBlob(blob); 詳細については、他の 2 つのブログ投稿を参照してください。
  • JavaScript はバックエンドから返された PDF ファイル ストリームを処理し、PDF ファイルをオンラインでプレビューしてダウンロードします。
  • Vue.js +pdf.jsは応答pdfファイルストリームデータを処理し、フロントエンドの画像プレビューをダウンロードできません

<a>タグのダウンロード属性はサポートされていないため、新しいiframeを作成してsrc属性を設定できます。

if (isIE()){
	$("a").bind('click',function(){
		var elemIF = document.createElement("iframe"); 
		elemIF.src = ファイルパス;
		elemIF.style.display = "なし"; 
		document.body.appendChild(要素IF);
	});
} それ以外 {
	$("a").attr("href",ファイルパス).attr("download",ファイル名);
}

以上がブラウザがIEかどうかを判定するJavaScriptの詳細です。ブラウザを判定するJavaScriptの詳細については、123WORDPRESS.COMの他の関連記事に注目してください。

以下もご興味があるかもしれません:
  • NodeJSとブラウザにおけるこのキーワードの違い
  • ブラウザのウェブページの自動スクロールとクリックを実現する JavaScript のサンプル コード
  • JavaScript を使用してブラウザでウェブカメラを使用する方法
  • JavaScript を使用してブラウザ履歴 API を操作する方法
  • JSクロスブラウザXMLアプリケーションプロセスの詳細な説明
  • モバイルブラウザがWeChat共有を呼び出す(JS)
  • ブラウザのJavaScriptデバッグ機能は使用できません。解決策
  • よく使われるJavaScriptツールの機能まとめ(ブラウザ環境)
  • js に基づいてブラウザの種類を判断する例
  • 現在のブラウザが JavaScript でヘッドレス ブラウザであるかどうかを検出する方法

<<:  Dockerコンテナを使用してホストネットワークにアクセスする方法

>>:  Mysql の遅いクエリ操作の概要

推薦する

HTML 5.1 学習: 14 の新機能とアプリケーション例

序文ご存知のとおり、HTML5 はインターネット コミュニティ全体に標準を提供する組織である Wor...

Vueでaxiosをカプセル化するいくつかの方法

目次ベーシックエディションステップ1: Axiosを構成するステップ2: リクエストをカプセル化する...

HTML ハイパーリンクの詳細な説明

ハイパーリンクハイパーリンクは、Web サイト上のすべてのページがハイパーリンクで接続され、ページ間...

Java は Excel から MySQL にデータをインポートします

実際の業務では、Excel からデータベースにデータをインポートする必要がある場合があります。データ...

nginx を https をサポートするように設定するためのサンプル コード

1. はじめにあなたのウェブサイトはまだインターネット上に公開されたままですか?ここでは、HTTPS...

Vue実戦記録のログインページの実装

目次1. 事前準備1.1 Node.jsをインストールする1.2 webpackをインストールする1...

htmlはハイパーリンク付きの新しいウィンドウを開き、ウィンドウのプロパティを制御できます。

1. HTMLハイパーリンクによって開かれるウィンドウのサイズコードをコピーコードは次のとおりです...

モバイルレイアウトにvw+remを使用する方法

まだ rem フレキシブルレイアウトを使用していますか?圧縮された js コードの大きなセクションを...

mysql のインデックスと FROM_UNIXTIME に関する問題

ゼロ、背景今週の木曜日にたくさんのアラートを受け取りました。DBA に確認を依頼したところ、遅いクエ...

MySQL が重複データを挿入するのを防ぐ 3 つの方法

新しいテーブルを作成する テーブル「人」を作成します( `id` int NOT NULL COMM...

Dockerコンテナ間で通信する3つの方法

Docker コンテナは互いに分離されており、相互にアクセスできないことは誰もが知っていますが、依存...

vue WatchとComputedの使用の概要

目次01. リスナーウォッチ(1)機能(2)特性と方法(3)監視対象(4)リスニングアレイ02. 計...

シーケンス関数を実装する MySQL コード

MySQLはシーケンス関数を実装する1. シーケンスレコードテーブルを作成する テーブル `sys_...